I have been using the "EMBEDDED OBJECT" html method to display my graphs, but there are still problems with IE, so I have been trying to switch to the other javascript method shown in the documentation which I have seen will fix this problem.
In my HTML file I have:
<div id="graph"></div>
I can make the charts appear no problem if I directly type in the script-based code into the HTML and the render/etc methods in a new div, for example:
<div id="chartdiv" align="left">Chart will appear here in div</div><script type="text/javascript">
var chart1 = new FusionCharts("../joe/Charts/FC_2_3_Pie2D.swf", "myChartID", "400", "250", "1", "0");
chart1.setDataURL("models/$model/maps/$shortoutfile.xml");
chart1.render("chartdiv");
</script>
however, the way my charts work is that the user presses a button on my HTML page, and there is an onClick=showGraph function call, where showGraph is in a separate "display.js" file.
If I use the basic <OBJECT> method within this display.js file, it works fine, like this:
var newHTML = "<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-44455354
0000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swfla
sh.cab#version=6,0,0,0" WIDTH="400" HEIGHT="200" id="FC_2_3_Pie3D"><PARA
M NAME=movie VALUE="../joe/Charts/FC_2_3_Pie3D.swf"><PARAM NAME="FlashVars"
VALUE="&dataURL=" + "path1/" + path2 + "/path3/" + xmlfile + ".xml&chartWidth
=400&chartHeight=200"><PARAM NAME=quality VALUE=high><PARAM NAME=bgcolor VALUE
=#FFFFFF><EMBED src="../joe/Charts/FC_2_3_Pie2D.swf" FlashVars="&dataURL=" +
"path1/" + path2 + "/path3/" + xmlfile + ".xml&chartWidth=400&chartHeight=200
" quality=high bgcolor=#FFFFFF WIDTH="400" HEIGHT="200" NAME="FC_2_3_Pie2D
" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.c
om/go/getflashplayer"></EMBED></OBJECT>";
graph.innerHTML = newHTML; (which puts this into the graph div defined above)
However when I try to incorporate the alternate JS code within the display.js file, like this:
graph.innerHTML = ('<div id="chartdiv">Chart will appear here</div><script type="text/javascript"> var chart1 = new FusionCharts("../joe/Charts/FC_2_3_Pie2D.swf", "myChartID", "400", "250", "1", "0"); chart1.setDataURL("path1/path2/path3/chart.xml"); chart1.render("chartdiv"); </script>');
nothing happens - the div's "chart will appear here" text is never replaced - I dont even get the usual errors (eg error loading XML) .. same thing if I take out the div id=chartdiv code..
Is there a code example available for how to do this that I have missed? Any ideas?