下面就分五个步骤讲解如何使用js来加载FusionCharts图形。
第一步:导入FusionCharts.js文件
[javascript] view plaincopyprint?
1. <script language="JavaScript" src="../FusionCharts/FusionCharts.js"></script>
第二步:定义一个DIV,它必须具备一个元素:id
[javascript] view plaincopyprint?
1. <div id="chartdiv_01" align="center"></div>
第三步:建立一个FusionCharts对象
[javascript] view plaincopyprint?
1. var myChart = new FusionCharts("para1", "para2", "para3", "para4");
Para1:表示的是SWF文件的地址
Para2:该图形的ID,这个可以随便命名,但是需要保证它的唯一性
para3:图形的高度。
Para4:图形的长度。
[javascript] view plaincopyprint?
1. var myChart = new FusionCharts("../FusionCharts/Doughnut3D.swf", "myChartId_02", "600", "500");
第四步:设置数据文件
[javascript] view plaincopyprint?
1. myChart.setDataURL("Data.xml");
第五步:指定图形渲染的位置。
[javascript] view plaincopyprint?
1. myChart.render("chartdiv_01");
通过上面五个步骤就是完成js加载FusionCharts图形。如果需要加载多个图形,只需要重复第二步—第五步,但是需要确保DIV和FusionCharts对象的id的唯一性。如:
[javascript] view plaincopyprint?
1. <div id="chartdiv_02" align="center"></div>
2. <script type="text/javascript">
3. var myChart = new FusionCharts("../FusionCharts/Doughnut3D.swf", "myChartId_02", "600", "500");
4. myChart.setDataURL("Data.xml");
5. myChart.render("chartdiv_02");