FusionCharts for Flex 如何更改图表数据
FusionCharts allows to change chart data and re-render the chart, after it has loaded on the user’s computer. This is possible with the help of methods, which are attached to each FusionCharts object.
In the following demonstrative example, we will change the data source of a chart when the chart is clicked upon. The XML code (below) dynamically changes the data source of the FusionCharts object.
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:components="com.fusioncharts.components.*" initialize="initApp()"> <components:FusionCharts id="FC1" x="10" y="10" FCChartType="Column3D" width="500" height="300" FCDataURL="Data.xml" /> <fx:Script>
<![CDATA[ import com.events.FCEvent;
import mx.collections.ArrayCollection;
import mx.controls.Alert; private function initApp():void {
FC1.addEventListener("FCClickEvent",clicked);
} private function clicked(e:FCEvent):void {
FC1.FCData(city_data);
FC1.FCParams(city_params);
FC1.FCRender();
} // Providing chart data as ArrayCollection to chart
[Bindable]
private var city_data:ArrayCollection = new ArrayCollection([
{label:'USA',value:'96000', link:'S-USA'},//注意 S- 是一个前缀标志 后边的内容可以在点击的时候获取到
{label:'Germany',value:'90000', link:'S-Germany'},
{label:'Austria',value:'58000', link:'S-Austria'},
{label:'Brazil',value:'50000', link:'S-Brazil'},
{label:'UK',value:'28000', link:'S-UK'},
{label:'Sweden',value:'25000', link:'S-Sweden'}
]); // Providing chart parameters as ArrayCollection to chart
[Bindable]
private var city_params:ArrayCollection=new ArrayCollection([
{caption:"Sales by Country"},
{subcaption:"(Click country item for details)"},
{numberPrefix:"$"},
{showValues:"0"}
]); ]]>
</fx:Script> </s:Application>
In the above code we doen the following:
Initially, we bind the event listener clicked to the click event of the FusionCharts file.
FC1.addEventListener("FCClickEvent",clicked);
The clicked method calls upon FCData, FCParams and FCRender of the FusionCharts object to perform the various functions. The data is set using the following method.
FC1.FCData( city_data );
Here city_data is an ArrayCollection object, which contains the datasets. The parameters are passed in the following manner:
FC1.FCParams(city_params);
Similarly, city_params is an ArrayCollection object containing the list of parameters.
Finally, FCRender method is called to render the chart.
FC1.FCRender();
FusionCharts for Flex 如何更改图表数据的更多相关文章
- GapMinder气泡图:在线互动图表数据平台
GapMinder:在线互动图表数据平台是一个将国际统计数据转换成活动的.交互的和有趣的图表,以在线统计数据为基础的互动图表集的完美世界.目的是通过增进对可以自由访问的公共统计数据的使用和理解,以促进 ...
- 更改Oracle数据文件名及数据文件存放路径
更改Oracle数据文件名及数据文件存放路径 SQL> select * from v$dbfile; FILE# NAME ---------- ---------------- ...
- HTML5线性图表 图表数据区域可着色
这是一款基于Canvas的HTML5图表应用,在图表数据初始化的时候伴随动画效果. 在线演示: 点击演示 源代码下载: 点击下载 核心jQuery代码: var myData = { labels ...
- centos 7.1系统更改Mariadb数据存储位置步骤分享
一.首先确保你要更改Mariadb数据存储的位置的空间够大 现在已将Mariadb存储位置更改到/opt/目录下 1.然后将Mariadb服务stop:systemctl stop mariadb 2 ...
- FusionCharts for Flex的属性和事件
FusionCharts for Flex的属性和事件 1.Properties(属性) (1)FCChartType (2)FCDataURL (3)FCDataXML (4)FCDebugMode ...
- Grafana 利用Grafana Variables变量配置快速切换不同主机的图表数据展示
用Grafana Variables变量配置快速切换不同主机的图表数据展示 by:授客 QQ:1033553122 测试环境 需求描述 操作步骤 结果展示 测试环境 influxdb-1.5.2. ...
- C# Chart使用总结 1 ---------关于图表数据的来源
关于图表数据的来源: 1.通过XValueMember YValueMembers 设置 OleDbConnection conn = new OleDbConnection(connStr); Ol ...
- 将Highcharts图表数据生成Table表格
有的时候,我们不仅仅需要漂亮的统计图来显示统计结果,还需要在统计图下方一个表格可以更加直观的展现各类数据.既然统计图都显示出来了,那我们可以根据统计图的各元素生成表格了. 首先,先显示统计图. Htm ...
- Echarts使用及动态加载图表数据 折线图X轴数据动态加载
Echarts简介 echarts,缩写来自Enterprise Charts,商业级数据图表,一个纯JavaScript的图表库,来自百度...我想应该够简洁了 使用Echarts 目前,就官网的文 ...
随机推荐
- 【js数据结构】图的深度优先搜索与广度优先搜索
图类的构建 function Graph(v) {this.vertices = v;this.edges = 0;this.adj = []; for (var i = 0; i < this ...
- iOS应用版本更新(自动提醒用户更新代码)
在#import "AppDelegate.h" 文件中的application:(UIApplication *)application didFinishLaunchingWi ...
- CPLD
复杂可编程逻辑器件(Complex Programmable Logic Device, CPLD),CPLD适合用来实现各种运算和组合逻辑(combinational logic).一颗CPLD内等 ...
- 在LXC Centos6-moban 编译安装mysql-5.6.36 时候遇见的报错
在LXC安装Centos6-moban 编译安装mysql-5.6.36 cmake . -DCMAKE_INSTALL_PREFIX=/application/mysql-5.6.36 -DMY ...
- java 面试题整理
java面试题 1.接口和抽象类的区别 抽象类 接口 抽象类中可以有默认方法 在java8之前,不能有默认方法 extends implements 抽象类中可以有构造器 接口中不能有构造器 抽象类中 ...
- JavaScript-条件循环
JavaScript-条件循环 条件判断语句 if 语句 - 只有当指定条件为 true 时,使用该语句来执行代码 if (表达式){ 当条件为 true 时执行的代码} if...else 语 ...
- html upload_file 对象(2018/02/26)工作收获
php.ini中可以设置上传文件的大小,如果超过设置大小,上传失败.$_File 数组当中接受到的文件对象size为0
- MySQL-05 用户管理
学习目标 权限表及其用法 账户管理 权限管理 访问控制 权限表 MySQL权限表存放在MySQL数据库里,由mysql_install_db脚本初始化.这些MySQL权限表分别为user.db.pro ...
- j数组对象去重
var Arrlist = [ {name:"张三",age:25,time:"2018-07-30 17:45:13"}, {name:"赵六&qu ...
- 整理几个牛人博客以及OJ
Blogs 陈立杰(wjmzbmr):http://wjmzbmr.com/ 飘过的小牛:http://blog.csdn.net/niushuai666 王垠:http://www.yinwang. ...