Fusioncharts图表组件API参考方法(Functions)汇总篇(续)

[摘要]: chartType()FusionCharts的JavaScript类API提供了大量的功能。下面的列表显示在每个功能的详细信息: 一、FusionCharts的类 - 实例功能 1、configure(name:string , value:string)  or  configure(configurations: Object) 作用:绘制图表前,图表配置设置。主要是,您可以使用此功能,使用此功能设置图表消息或电网参数。的名称的结构和配置的值被作为参数传递。在右边的第一个例子。您也可以通过配置对象的功能的集合。参数对象将包含名称和值对配置名称和相应的值。在右边的第二个例子。 myChart.configure("ChartNoDataText", "Please select a record ...

chartType()FusionCharts的JavaScript类API提供了大量的功能。下面的列表显示在每个功能的详细信息:

一、FusionCharts的类 - 实例功能

1、configure(name:string , value:string)  or  configure(configurations: Object)

作用:绘制图表前,图表配置设置。主要是,您可以使用此功能,使用此功能设置图表消息或电网参数。的名称的结构和配置的值被作为参数传递。在右边的第一个例子。您也可以通过配置对象的功能的集合。参数对象将包含名称和值对配置名称和相应的值。在右边的第二个例子。

view sourceprint?

1.myChart.configure("ChartNoDataText", "Please select a record above");

2.

3.or

4.

5.myChart.configure({ "ChartNoDataText" : "Please select a record above" , "InvalidXMLText" : "Please validate data" });

2、addVariable(name:string , value:string)

作用:与configure方法一样,此功能已经过时了的。

view sourceprint?

1.myChart.addVariable("ChartNoDataText", "Please select a record above");

3、render(renderAt: String) or  render(renderAt: HTMLNode)

作用:主要作用是将新建的图表装载到指定的某个DIV容器内。

view sourceprint?

1.myChart.render("chartContainer");

2.

3.or

4.

5.myChart.render(document.getElementById ("chartContainer"));

4、setXMLUrl(Url: String)

作用:设置图表实例的XMLUrl参数,主要是用于动态修改数据源xml的路径。

view sourceprint?

1.myChart.setXMLUrl("mychartdata.xml");

5、setXMLData(XML: string)

作用:主要是设置图表对象XMLData,参数传递为拼接好的图表字符串。

view sourceprint?

1.myChart.setXMLData("<chart><set value=‘100‘ /></chart>");

6、setJSONUrl(Url: String)

作用:设置图表对象JSONUrl参数。

view sourceprint?

1.myChart.setJSONUrl("myJSONStream.json");

7、setJSONData(JSON:Object)  or setJSONData(JSON:String)

作用:动态设置或者修改图表对象的数据,格式为:Json格式的字符串。

view sourceprint?

01.myChart.setJSONData( {

02."chart":{

03."caption":"My Chart Caption"

04.},  

05."data":[

06."value":"100" },

07."value":"200" }

08.]

09.}

10.);

11.

12.

13.or

14.

15.myChart.setJSONData(‘{"chart":{ "caption":"My Chart Caption" }, "data":[ {"value":"100" }, { "value":"200" } ] });

8、setChartDataUrl(Url:String, dataFormat: string)

作用:当我们的图表数据是来自于一个页面所产生的数据时,我们就可以用此方法。

参数说明:

Url:产生数据的页面地址

dataFormat:产生数据的格式(xml、json)

view sourceprint?

1.myChart.setChartDataUrl("mydynamicdata.aspx", "json");

2.

3.or

4.

5.myChart.setChartDataUrl("mydynamicdata.aspx", "xml");

9、setChartData(dataSource: string, dataFormat: string)

作用:设置或者修改图表数据。这个函数有两个参数。第一个是数据源中的数据。第二个是DATAFORMAT。数据源可以是XML源的URL,URL JSON源,XML字符串,JSON字符串和JSON对象。因此,正确识别的格式,数据格式作为第二个参数传递。

view sourceprint?

01.myChart.setChartData( "myxmldata.jsp" , "xmlurl");

02.

03.or

04.

05.myChart.setChartData( "<chart><set value=‘2310‘/></chart>" , "xml");

06.

07.or

08.

09.myChart.setChartData( "myjsondata.php" , "jsonurl");

10.

11.or

12.

13.myChart.setChartData( "{ chart : {}, data :[{ value : 100 }] }" , "json");

14.

15.

16.or

17.

18.myChart.setChartData( { chart : {}, data :[{ value : 100 }] } , "json");

10、setDataURL(Url:string)

作用:利用此功能可以在设置或更新图表图表URL的XML数据。这个函数接受一个URL字符串。

view sourceprint?

1.myChart.setDataURL( "myxmlsource.xml" );

11、setDataXML(dataSource: string)

作用:利用此功能可以在设置或更新图表XML数据的字符串。

view sourceprint?

1.myChart.setDataXML( "<chart><set value=‘213‘ /></chart>");

12、SetTransparent ( isTransparent: boolean )

作用:使图表背景成为透明的。您将需要设置bgAlpha,canvasBgAlpha等属性的<chart>元素来完成的透明度。该函数接受一个布尔参数。只有为true的时候,背景图才会产生透明效果。

view sourceprint?

1.myChart.setDataXML( "<chartbgAlpha=‘0,0‘><set value=‘213‘ /></chart>");

2.myChart.setTransparent(true);

13、getChartData(dataFormat:string)

作用:这个函数返回图元数据格式的数据作为参数提供。当传递XML作为数据格式,它提供了XML数据的字符串。 ,当JSON是通过为数据格式,数据被返回的JSON对象。

view sourceprint?

1.var myXML = FusionCharts("myChartId").getChartData( "xml");

2.var myJSONObj = FusionCharts("myChartId").getChartData( "json" );

14、getXMLData()

作用:获取图表的XML数据串。

view sourceprint?

1.var myXML = FusionCharts("myChartId").getXMLData();

15、getJSONData()

作用:获取图表数据的Json对象。

view sourceprint?

1.var myJSONObj = FusionCharts("myChartId").getJSONData();

16、getDataAsCSV()

作用:CSV字符串返回数据的图表。输出CSV字符串,可以使用XML参数配置。 String,表示CSV格式数据的图表。

view sourceprint?

1.var strCSV = FusionCharts("myChartId").getDataAsCSV();

17、getXML()

作用:获取图表数据的XML

view sourceprint?

1.var myXML = FusionCharts("myChartId").getXML();

18、getChartAttribute()

作用:返回的属性值中指定的图表XML节点或“图表”属性的JSON数据。如果属性是空的,那就是没有找到其XML或者Json数据。

view sourceprint?

1.//获取图表的标题

2.var caption = FusionCharts("myChartId").getChartAttribute( "caption");

19、setChartAttribute(name:string, value:string) or  setChartAttribute(AttributeCollection:Object)

作用:设置图表属性的新值更新图表。它有两个参数。的属性的名称和参数值。顾名思义图表的根属性(也被称为“图表属性”,这是通过<chart>元素在图表的XML数据或图表的JSON数据通过图表财产)。您还可以通过将它们作为一个对象的属性名和值对的集合功能。在右边的第二个例子。一旦图表属性得到改变,drawcomplete的的事件被触发。

view sourceprint?

1.myChart.setChartAttribute ( "caption" , "Latest sales report" );

2.

3.or

4.

5.chartReference.setChartAttribute( { "palette" : "2", paletteColors : "ACBF72", useRoundEdges : 1 } );

20、configureLink(objConfiguration: Object, level:Number)  or configureLink(arrConfiguration: Array)

作用:通过此功能,您可以将所有您想要的的LinkedCharts配置。您可以通过一个FusionCharts的构造函数接受的所有的属性。这些图表属性将被应用的LinkedCharts。如果没有提供,LinkedCharts将继承属性从父图表。
此外,您还可以配置的叠加按钮,使用overlayButton财产。这些设置还可以去另一个对象。configureLink函数可以接受两种格式的参数:作为两个独立的参数,第一个参数是一个对象,其中包含的所有配置(图叠加按钮)。第二个参数接受一个数字表示所配置的水平。第一向下钻取级别为0(零)。请参阅例如,在顶部的右侧。作为一个单一的二维索引数组,每个元素是一个对象,它包含所有的图表和覆盖按钮的相关配置。每个向下钻取级别由第一级是0(零)的阵列,其中的索引表示。所以,在一个特定的数组索引“对象实际上等于阵列的索引号的电平数字,这是适用于这些设置。请参阅例如,在右边的底部。

view sourceprint?

01.myChart.configureLink(

02.{

03.swfUrl: ‘Charts/Bar2D.swf‘,

04.width: ‘30%‘,

05.

06.overlayButton:

07.{   

08.message: ‘ x ‘,

09.bgColor:‘999999‘,

10.borderColor: ‘cccccc‘

11.}

12.},

13.0);

14.

15.or

16.

17.myChart.configureLink(

18.[ {swfUrl: ‘Charts/Bar2D.swf‘},

19.{swfUrl: ‘Charts/Pie2D.swf‘},

20.{swfUrl: ‘Charts/Line2D.swf‘},

21.{swfUrl: ‘Charts/Area2D.swf‘}

22.]

23.);

21、resizeTo(width:String, height:String)

作用:此功能调整现有的图表。你可以通过宽度和高度值的百分比或像素值(没有PX后缀)。一旦被调整大小调整大小(FC_Resized)图表中,drawcomplete事件被触发。

view sourceprint?

1.myChart.resizeTo( "500", "400" )

2.or

3.myChart.resizeTo( "80%", "100%" )

22、exportChart( exportSettings: Object)

作用:调用图表保存为PDF /图片。

view sourceprint?

1.myChart.exportChart( { exportFormat : ‘jpg‘} )

2.or

3.myChart.exportChart( { exportAtClient: ‘1‘,  exportFormat: ‘PDF‘ } );

23、print()

作用:打印图表

view sourceprint?

1.FusionCharts("myChartId").print()

24、clone( [chartParams: Object] )

作用:该功能可让您复制一个FusionCharts的JavaScript对象和使用它的设置来创建另一个图表。该功能可以选择一个对象作为参数。对象可以包含图表设置之前,它被克隆,这将覆盖现有的源图的设置。该函数返回的FusionCharts JavaScript对的一个实例。

view sourceprint?

1.var newChart = myChart.clone();

2.or

3.var newChart = myChart.clone( { swfUrl : ‘Area2D.swf‘ } );

25、dispose()

作用:删除、清除某个图表实例。此外,该函数将配合BeforeDispose事件,以消除图表和处理后的图表已被删除。

view sourceprint?

1.FusionCharts("myChartId").dispose();

26、chartType()

作用:这个函数返回的图表类型或图表所呈现的FusionCharts的JavaScript对象的别名。请注意,别名的值是依赖于图表SWF文件名。

view sourceprint?

1.var strCharType = FusionCharts("myChartId").chartType();

27、isActive()

作用:此功能检查是否FusionCharts的SWF是可见的和激活的。返回true或false。

view sourceprint?

1.var strCharType = FusionCharts("myChartId").isActive();

28、hasRendered()

作用:这个函数返回布尔值,指示是否已完成呈现的图表。hasRendered()已过时

view sourceprint?

1.var strCharType = FusionCharts("myChartId").hasRendered();

29、signature()

作用:它返回一个字符串,代表的签名图。 FusionCharts的XT服务发布4个图表,它是“FusionCharts/3.2.2(XT)SR4”

view sourceprint?

1.var strCharType = FusionCharts("myChartId").signature();

时间: 2024-10-23 08:18:10

Fusioncharts图表组件API参考方法(Functions)汇总篇(续)的相关文章

FusionCharts使用问题及解决方法(五)-FusionCharts常见问题大全

在前4篇文章中,我们总结了FusionCharts XT图表使用中的一些常见问题(FAQ)及解决方法,本文继续讨论FusionCharts使用者常见的一些复杂报错及错误的调试/解决方法. 问题描述:是否可以利用FusionCharts XT 在Flex程序中创建图表? 解决方法:不可以.若你需要在Flex程序中创建图表,你需要借助于FusionCharts for Flex中经过专门编译的SWF文件.此外,你还需要使用Flex Builder组件--FusionCharts.swc,将图表加载到

FusionCharts使用问题及解决方法(四)-FusionCharts常见问题大全

在前3篇文章中,我们总结了FusionCharts图表的一些常见问题(FAQ)及解决方法,本文继续讨论FusionCharts使用者常见的一些复杂的报错及解决方法. 问题描述:使用FusionCharts时,我想在一个给定的时间间隔内自动在服务器端生成图表,将最新生成的图表以电子邮件方式发出去? 解决方法:请注意,目前为止FusionCharts 不支持直接通过邮件发送图表.但是FusionCharts图表组件允许你将图片导出为图像并保存在服务器上.因此,你可以编写你自己的脚本,然后自动地将保存

关于Highcharts图表组件动态修改属性的方法(API)总结之Series

Highcharts图表组件内的Series很重要,如果说Categries是其大脑,那么Series就是其心脏.这两者才是Highcharts图表组件的重中之重啊.接下来就为大家介绍关于设置Series的相关方法. 一.目录结构 二.API 1.addPoint(添加一个数据点) 参数: options:数据值(①可以是具体的一个Y轴数值,那么X轴坐标系统会随即分配一个:②可以设置一个数组,有着X和Y的数值,如:[xValue,yVlaue] 这样的形式:③可以设置一个Object(对象),详

二十三、【开源】EFW框架Web前端开发之常用组件(FusionCharts图表、ReportAll报表等)

回<[开源]EFW框架系列文章索引>        EFW框架源代码下载V1.2:http://pan.baidu.com/s/1hcnuA EFW框架实例源代码下载:http://pan.baidu.com/s/1o6MAKCa 前言:上一章讲了EFW框架中的界面框架JqueryEasyUI,在一个Web系统开发中除了需要一个好的界面框架还有需要一些功能,比如:图表展示.Web报表预览打印.文件上传.文本编辑等功能在Web系统开发过程中也是经常用到的:为了方便大家使用EFW框架开发系统,本人

微信小程序开发—快速掌握组件及API的方法---转载

微信小程序框架为开发者提供了一系列的组件和API接口. 组件主要完成小程序的视图部分,例如文字.图片显示.API主要完成逻辑功能,例如网络请求.数据存储.音视频播放控制,以及微信开放的微信登录.微信支付等功能. 组件 官方文档:https://mp.weixin.qq.com/debug/wxadoc/dev/component/ 对于开发文档,个人建议先了解其整体框架,了解其提供了哪些组件,再联想到这些组件会用在哪些产品的哪些功能.对于接口也是一样,整体了解,而不需要细看. 熟悉了文档的结构,

Windows API参考大全新编

书名:新编Windows API参考大全 作者:本书编写组 页数:981页 开数:16开 字数:2392千字 出版日期:2000年4月第二次印刷 出版社:电子工业出版社 书号:ISBN 7-5053-5777-8 定价:98.00元 内容简介 作为Microsoft 32位平台的应用程序编程接口,Win32 API是从事Windows应用程序开发所必备的.本书首先对Win32 API函数做完整的概述:然后收录五大类函数:窗口管理.图形设备接口.系统服务.国际特性以及网络服务:在附录部分,讲解如何

FusionCharts使用问题及解决方法(三)-FusionCharts常见问题大全

前两篇文章中,我们总结了FusionCharts图表的一些常见问题(FAQ)及解决方法,本文继续讨论FusionCharts使用者常见的一些复杂的报错及解决方法. 当HTML.SWF和JavaScript文件在同一个文件夹中时, FusionCharts工作正常,但是如果它们被放到不同的文件夹中,FusionCharts无法正常工作? 你需要注意以下几点: 1.如果你从另外一个域中获取数据的话,FusionCharts无法正常工作,因为Flash图表会阻止跨域传送数据. 2.如何你将这3个文件放

转:ECharts图表组件之简单关系图:如何轻松实现另类站点地图且扩展节点属性实现点击节点页面跳转

站点地图不外乎就是罗列一个网站的层次结构,提炼地讲就是一个关系结构图.那么我们如何巧用ECharts图表组件内的简单关系结构图来实现一个站点的地图结构呢?另外如何点击某个节点的时候实现页面跳转呢? 针对上述所提出的疑问,我琢磨了一下ECharts图表组件.找到官方这样的一个适合的简单关系图:http://echarts.baidu.com/doc/example/force1.html 通过观察ECharts图表组件的简单关系图的数据结构,得出我要实现一个站点地图需要做哪些工作: 1.引入ech

微信小程序图表组件 wx-f2

摘自 杀个程序猿祭天  https://www.jianshu.com/p/6b9fe45f799f Github地址:https://github.com/antvis/wx-f2 AntV F2地址: AntV F2 微信小程序图表组件 wx-f2,源于 F2,专为移动而生 F2,专为移动而生的可视化解决方案,特为大家提供了微信小程序端版本,体积小巧,性能卓越,底层基于图形语法,可以提供非常丰富的图表类型. 可以使用微信扫描以下二维码先体验一番: image wx-f2 F2 的微信小程序版