I am trying to do a Stacked3D Column chart using JSON as the data source and I can't seem to get past a JS Error. All FireBug or Chrome will tell me is:
Uncaught TypeError: Illegal invocationI have done everything I can think of to resolve this. I have tested it in Chrome 13, FF 6.0.2, Safari 5.1 all with the same results but slightly different wording on the error.
TThe HTML of the page is this:
<html> <head> <title> Distinct Projects by Program</title> <script type="text/javascript" src="charts/FusionCharts/Charts/FusionCharts.js"></script> </head> <body> <div id="chartContainer" style="height:100%;">FusionCharts will load here!</div> <script type="text/javascript"><!-- FusionCharts._fallbackJSChartWhenNoFlash(); FusionCharts.debugMode.enabled(true); FusionCharts.debugMode.outputTo(console.log); var myChart = new FusionCharts( "charts/FusionCharts/Charts/StackedColumn3D.swf", "myChartId", "800", "600", "1", "1" ); myChart.setJSONData({ "chart":{ "caption":"Annual Revenue", "subcaption":"In Million {:content:}quot;, "xaxisname":"Year", "pyaxisname":"Sales in M{:content:}quot;, "syaxisname":"Cost as % of Revenue", "decimals":"0", "numberprefix":"{:content:}quot;, "numbersuffix":"M", "snumbersuffix":"%25" }, "categories":[{ "category":[ { "label":"2001" }, { "label":"2002" }, { "label":"2003" }, { "label":"2004" }, { "label":"2005" } ] } ], "dataset":[{ "dataset":[{ "seriesname":"Product A", "color":"AFD8F8", "showvalues":"0", "data":[ { "value":"30" }, { "value":"26" }, { "value":"29" }, { "value":"31" }, { "value":"34" } ] }, { "seriesname":"Product B", "color":"F6BD0F", "showvalues":"0", "data":[ { "value":"21" }, { "value":"28" }, { "value":"39" }, { "value":"41" }, { "value":"24" } ] } ] }, { "dataset":[{ "seriesname":"Service A", "color":"8BBA00", "showvalues":"0", "data":[ { "value":"27" }, { "value":"25" }, { "value":"28" }, { "value":"26" }, { "value":"10" } ] }, { "seriesname":"Service B", "color":"A66EDD", "showvalues":"0", "data":[ { "value":"17" }, { "value":"15" }, { "value":"18" }, { "value":"16" }, { "value":"10" } ] }, { "seriesname":"Service C", "color":"F984A1", "showvalues":"0", "data":[ { "value":"12" }, { "value":"17" }, { "value":"16" }, { "value":"15" }, { "value":"12" } ] } ] } ]}); myChart.render("chartContainer"); // --> </script> </body> </html> As you can see I have resorted to just using the sample data from the Stacked JSON example, I did this after my data wouldn't work.
The page can be accessed here: http://attaskexpert....ckProgCount.php
The swf and js paths are correct and in the same domain.
The output of debug provides this:
Info: Chart loaded and initialized.
Initial Width: 800
Initial Height: 600
Scale Mode: noScale
Debug Mode: Yes
Application Message Language: EN
Version: 3.2.1
Chart Type: Stacked 3D Column Chart
Chart Objects:
BACKGROUND
CANVAS
CAPTION
SUBCAPTION
YAXISNAME
XAXISNAME
DIVLINES
YAXISVALUES
DATALABELS
DATAVALUES
TRENDLINES
TRENDVALUES
DATAPLOT
TOOLTIP
VLINES
LEGEND
VLINELABELS
INFO: Chart registered with external script. DOM Id of chart is myChartId
INFO: XML Data provided using dataXML method.
XML Data: <chart caption="Annual Revenue" subcaption="In Million {:content:}quot; xaxisname="Year" pyaxisname="Sales in M{:content:}quot; syaxisname="Cost as % of Revenue" decimals="0" numberprefix="{:content:}quot; numbersuffix="M" snumbersuffix="%25"><categories><category label="2001" /><category label="2002" /><category label="2003" /><category label="2004" /><category label="2005" /></categories><dataset><dataset seriesname="Product A" color="AFD8F8" showvalues="0"><set value="30" /><set value="26" /><set value="29" /><set value="31" /><set value="34" /></dataset><dataset seriesname="Product B" color="F6BD0F" showvalues="0"><set value="21" /><set value="28" /><set value="39" /><set value="41" /><set value="24" /></dataset></dataset><dataset><dataset seriesname="Service A" color="8BBA00" showvalues="0"><set value="27" /><set value="25" /><set value="28" /><set value="26" /><set value="10" /></dataset><dataset seriesname="Service B" color="A66EDD" showvalues="0"><set value="17" /><set value="15" /><set value="18" /><set value="16" /><set value="10" /></dataset><dataset seriesname="Service C" color="F984A1" showvalues="0"><set value="12" /><set value="17" /><set value="16" /><set value="15" /><set value="12" /></dataset></dataset></chart>
Any ideas would be greatly appreciated.
Thank you in advance,
John