fusioncharts json java_fushioncharts 使用教程要点---使用JSON数据方式

1.建立图表步骤:

A.下载fushionChart,引入FusionCharts.js和FusionChartsExportComponent.js文件

B.建立图表对象

var chart1 = new FusionCharts(imgUrl, "chart1Id", "800", "400","0","1");

param1:使用的flash文件的路径

param2:对象ID

param3:图表长

param4:图表高

param5:是否显示Debug信息

param6:使用图片导出时需置为1

C:设置图表对象对应XML内容

使用JSON数据,拼接为XML格式数据

XML格式如下

//简单格式

//复杂格式 双Y轴

//x轴值 dataset中的值个数需与之一致

将拼接好的字符串设置-->

chart1.setDataXML(strXML);

strXML为拼接好的XML字符创

D:render至DIV中

chart1.render("container");  container为html中id为此的div空标签

至此,图表建立完毕,接下来进行图表的导出

2.图表的导出

A:在拼接的字符串中的chart元素中,增加属性exportEnabled='1' exportAtClient='1' exportHandler='fcExporter1'

B:在图表render之后代码下,配置导出图表的对象及按钮样式

var myExportComponent = new FusionChartsExportObject("fcExporter1", "/adminthemes/FusionCharts/FCExporter.swf");  //该flase文件是固定路径,第一个参数要与chart元素属性exportHandler一致

myExportComponent.componentAttributes.btnColor = 'EAF4FD';

myExportComponent.componentAttributes.btnBorderColor = '0372AB';

myExportComponent.componentAttributes.btnFontFace = 'Verdana';

myExportComponent.componentAttributes.btnFontColor = '0372AB';

myExportComponent.componentAttributes.btnFontSize = '12';

//Title of button

myExportComponent.componentAttributes.btnsavetitle = '另存为'

myExportComponent.componentAttributes.btndisabledtitle = '右键生成图片';

myExportComponent.Render("fcexpDiv");

至此,导出亦可以使用,不过有个Bug,当对此调用这个myExportComponent对象时候,第二次将无法使用

对此,我找遍百度也没找到解决方式,最后,自己观察这控件自动生成的代码得出结论,将自动生成的object标签的id更改为第一次载入的时候的id即可,即:

//更改object标签id使之初始化

$("#fcexpDiv object").attr("id","fcExporter1");

只有这样,object标签才会初始化,而通过删除其自动生成的代码并无法正在初始化,原因不明.