Fusioncharts图表组件事件API汇总

[ 摘要]: 我们在使用Fusioncharts图表组件的时候,需要一些事件监听来帮助我们了解Flash加载图表数据的情况是怎么样的,特此总结了一下相关的事件API如下所示: 1、API:Initialize(初始化)事件 作用:提示用户Fusioncharts图表组件相关的Flash和JS文件等等是否准备就绪,能够创建Fusioncharts图表对象。 Code: ///添加初始化完成的事件Initialized FusionCharts.addEventListener('Initialized', function (identifier, parameter) { alert(identifier.sender.id + "图表已经初始化完成"); }); va...

我们在使用Fusioncharts图表组件的时候,需要一些事件监听来帮助我们了解Flash加载图表数据的情况是怎么样的,特此总结了一下相关的事件API如下所示:

1、API:Initialize(初始化)事件

作用:提示用户Fusioncharts图表组件相关的Flash和JS文件等等是否准备就绪,能够创建Fusioncharts图表对象。

Code:


view source print ?
1. ///添加初始化完成的事件Initialized
2. FusionCharts.addEventListener('Initialized'function (identifier, parameter) {
3. alert(identifier.sender.id + "图表已经初始化完成");
4. });
5. var myChart = new FusionCharts("/swf/Charts/Column3D.swf""myChartId""400""300""0""1");
6. myChart.setXMLData('');
7. myChart.render("chartContainer");



2、API:DataUpdated(数据更新)事件

作用:主要是监听图表组件有数据加载的时候就会提示这个信息

Code:


view source print ?
1. ///添加初始化完成的事件DataUpdated
2. FusionCharts.addEventListener('DataUpdated'function (eventObject, argumentsObject) {
3. alert(eventObject.sender.id + "数据更新")
4. });



3、API:Loaded(数据加载)事件

作用:主要是用于判断图表是否加载到指定的DIV容器内

Code:


view source print ?
1. var myChart = new FusionCharts("../../../../Charts/Column3D.swf""myChartId""400""300""0""1");
2. myChart.setXMLData('');
3. myChart.render("chartContainer");
4. ///监听Loaded事件 判断是否已经加载数据
5. myChart.addEventListener("Loaded"function (evt, args) {
6. alert(evt.sender.id + "图表已经被加载。");
7. });



4、API:Rendered(呈现)事件

作用:主要是用于判断Flash图表是否已经呈现在DIV容器内,且已经能够看到Flash图表的雏形。

Code:


view source print ?
1. var myChart = new FusionCharts("../../../../Charts/Column3D.swf""myChartId""400""300""0""1");
2. myChart.setXMLData('');
3. myChart.render("chartContainer");
4. ///监听Rendered事件 判断是否已经呈现于DIV容器内
5. myChart.addEventListener("Rendered"function (evt, args) {
6. alert(evt.sender.id + "图表已经呈现于DIV容器内");
7. });


5、API:DrawComplete(画完成)事件

作用:主要用于判断提供给Flash的数据是否完全在图标上得到展现,且全部完成。这个事件很重要,对于那些一个页面有多个图表,且需要一个个加载的时候,就可以使用这个事件,具体见如下Code中所述。

Code:


view source print ?
01. function DrawChartOne() {
02. var myChart = new FusionCharts("../../../../Charts/Column3D.swf""myChartId""400""300""0""1");
03. myChart.setXMLData('');
04. myChart.render("chartContainer");
05. //添加监听事件DrawComplete,判断图表是否画完全
06. myChart.addEventListener("DrawComplete"function () {
07. alert("图表1已经全部画完。");
08. //开始这手加载图表2
09. DrawChartTwo();
10. }
11. );
12. }
13. //加载图表2
14. function DrawChartTwo() {
15. var myChartTwo = new FusionCharts("../../../../Charts/Column3D.swf""myChartId""400""300""0","1");
16. myChartTwo.setXMLData('');
17. myChartTwo.render("chartContainer");
18. //添加监听事件DrawComplete,判断图表是否画完全
19. myChartTwo.addEventListener("DrawComplete"function () {
20. alert("图表2已经全部画完。");
21. //然后这里该干嘛就干嘛
22. }
23. );
24. }
25. //初始化页面 加载图表
26. $(document).ready(function () {
27. DrawChartOne();
28. });



6、API:Resized(缩放)事件

作用:当图表大小(高、宽)值发生变化的时候,就会触发此事件。

Code:

view source print ?
1. var myChart = new FusionCharts("../../../../Charts/Column3D.swf""myChartId""100%""100%""0""1");
2. myChart.setXMLData('');
3. myChart.render("chartContainer");
4. //监听缩放事件
5. myChart.addEventListener("Resized"function (evt, args) {
6. alert(evt.sender.id + "图表已经缩放 从 ( width: " + args.prevWidth + ", height: " + args.prevHeight + ") 到 (width: " + args.width + ", height: " + args.height + ")");
7. });


7、API:Exported(导出图表)事件

作用:当我们允许图表有导出菜单的情况下,导出图表的时候,会提示您是否可以导出。

Code:


view source print ?
1. //监听图表导出事件
2. myChart.addEventListener("Exported"function (evt, args) {
3. alert(args.DOMId + (args.statusCode ? " 图表已经导出" "图表不能够被导出"));
4. });


8、API:PrintReadyStateChange(准备好打印)事件

9、API:BeforeLinkedItemOpen(点击图表内项目)事件

10、API:LinkedItemOpened(点击图表内项目已经响应)事件

11、API:BeforeLinkedItemClose(连接打开项目开始关闭)事件

12、API:LinkedItemClosed(连接打开项目已经关闭)事件

13、API:DataLoadError(图表数据加载错误)事件

作用:可以便于我们判断错误定位位置,数据源提供有误/Flash地址不正确/DIV容器不存在;

14、API:DataXMLInvalid(XML数据提供有问题)事件

作用:用于判断我们提供给Fusioncharts图表的XML数据格式存在问题;

Code:

view source print ?
1. var myChart = new FusionCharts("../../../../Charts/Column3D.swf""myChartId""400""300""0""1");
2. myChart.setXMLData(">");
3. myChart.render("chartContainer");
4. //用户判断XML数据格式存在错误
5. function FC_DataXMLInvalid(DOMId) {
6. alert("Invalid XML data error occured in chart having id - " + DOMId);
7. }

15、API:NoDataToDisplay(没有数据)事件

作用:用于判断提供给图表的数据没有。只有一个空空的chart。

Code:

view source print ?
1. var myChart = new FusionCharts("../../../../Charts/Column3D.swf""myChartId""400""300""0""1");
2. myChart.setXMLData("");
3. myChart.render("chartContainer");
4. //用户判断图表没有任何数据
5. function FC_NoDataToDisplay(DOMId) {
6. alert("没有人任何数据展示在图表内- " + DOMId);
7. }

16、API:BeforeDispose(图表即将释放)事件

Code:

view source print ?
1. FusionCharts.addEventListener(FusionChartsEvents.BeforeDispose, function (identifier, parameter) {
2. alert(identifier.sender.id + "图表即将释放");
3. });


17、API:Disposed(图表已经释放)事件

Code:

view source print ?
1. FusionCharts.addEventListener("Disposed"function (identifier, parameter) {
2. alert(identifier.sender.id + "图表已经释放掉。");
3. });


文章来源:http://www.stepday.com/topic/?290

你可能感兴趣的:(Fusioncharts图表组件事件API汇总)