Hi,
I noticed that when I define my table using thead and tbody tags the charts are rendered incorrectly. In the case of the MSLine2D chart this causes the last row of the table to be ignored by the chart and the line on the chart denoting "Product1" is actually using the data from the line "Product2" and so on but showing Product 1's name. Similar things happen for MSColumn3D and I assume others too.
Here's the code to replicate the problem, based on data-source-htmltable.html from the jQuery version of FusionCharts.
Here's how it should display:
<table id="myHTMLTable" border="1" align="center">
<tr> <th> </th> <th>2005</th> <th>2006</th> <th>2007</th> </tr>
<tr> <td>Product 1</td> <td>13</td> <td>25</td> <td>16</td> </tr>
<tr> <td>Product 2</td> <td>23</td> <td>34</td> <td>8</td> </tr>
</table>
<script type="text/javascript">
$('#myHTMLTable').convertToFusionCharts({
swfPath: "../Charts/",
type: "MSLine2D",
data: "#myHTMLTable",
dataFormat: "HTMLTable"
});
</script>
(see correct.png)
Here's how it displays when using thead and tbody:
<table id="myHTMLTable" border="1" align="center">
<thead><tr> <th> </th> <th>2005</th> <th>2006</th> <th>2007</th> </tr></thead>
<tbody>
<tr> <td>Product 1</td> <td>13</td> <td>25</td> <td>16</td> </tr>
<tr> <td>Product 2</td> <td>23</td> <td>34</td> <td>8</td> </tr>
</tbody>
</table>
<script type="text/javascript">
$('#myHTMLTable').convertToFusionCharts({
swfPath: "../Charts/",
type: "MSLine2D",
data: "#myHTMLTable",
dataFormat: "HTMLTable",
});
</script>
(see incorrect.png)
Hacking through the code it appears (at least in this instance) that when using thead or tbody the opts.labels variable gets populated with the cells of of the first row (Product 1) incorrectly, without thead or tbody only the header row is inserted here. This comes from tbl.find('tr:nth-child('+opts.labelSource+'),') which is returning both rows.
Also I noticed when using a tfoot tag it doesn't seem to render the summed data at all - perhaps this could be an option?.
Thanks .
