首页 > 其他 > 详细

FusionCharts XT 从零学习1

时间:2014-04-17 18:14:38      阅读:548      评论:0      收藏:0      [点我收藏+]

(需要导入官方的FusionCharts文件夹(包含js和swf))

新建一个FusionCharts需要三步:

 1.new 一个FusionCharts对象(var chart = new FusionCharts(Relative URL of the chart SWF file of the chart type,ID of the chart,width,height,debugMode parameter);)

 2.加载xml或者json数据(chart.setXMLDATA(data);)

 3.设置chart的显示位置id(chart.render(id))

 

FusionCharts XT可以使用两种格式作为数据来源(XML&JSON)。两种数据来源也提供了两种方法获取来源:

 1.fusionCharts.setXML(or JSON)DATA();

 2.fusionCharts.setXMLUrl(or JSON)DATA();

简单示例代码如下:

bubuko.com,布布扣
 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta charset="UTF-8">
 5 <title>Insert title here</title>
 6   <script type="text/javascript" src="../FusionCharts/FusionCharts.js">    </script>
 7 </head>
 8 <body>
 9  <div id="chartContainer">FusionCharts XT will load here!</div>             
10   <script type="text/javascript">  
11   var json = {"chart":{"caption":Weekly Sales Summary ,  "xAxisName":Week, "yAxisName":Amount, "numberPrefix":$},
12                 "data":[
13                         {"label":Week 1 ,"value":14400},
14                         {"labe2":Week 2 ,"value":42400},
15                         {"labe3":Week 3 ,"value":34400},
16                         {"labe4":Week 4 ,"value":23400}
17                         ]
18                   
19              };
20   var myChart = new FusionCharts( "FusionCharts/Column3D.swf", "myChartId", "400", "300", "0" );    
21   myChart.setJSONDATA(json);    
22   myChart.render("chartContainer");        
23   </script>
24 </body>
25 </html>
bubuko.com,布布扣

 

FusionCharts XT 从零学习1,布布扣,bubuko.com

FusionCharts XT 从零学习1

原文:http://www.cnblogs.com/yuqian-gongqifen/p/3670364.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!