Flex中的FusionCharts 2D饼图
1、设计思路
(1)FusionCharts中有Flex组件文件FusionCharts.swc,这样可以让FusionCharts用Flex展示出来;
(2)利用xmlns:components="com.fusioncharts.components.*"组件,将FusionCharts嵌入到Flex中。
2、Flex中展现FusionCharts饼图源码
pieChart.mxml:
<?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" width="100%" height="100%" xmlns:components="com.fusioncharts.components.*" creationComplete="initHandler()"> <s:layout> <s:VerticalLayout horizontalAlign="center" verticalAlign="middle"/> </s:layout> <fx:Declarations> <!-- 将非可视元素(例如服务、值对象)放在此处 --> </fx:Declarations> <fx:Script> <![CDATA[ import mx.collections.ArrayCollection; import mx.events.FlexEvent; import org.osmf.events.TimeEvent; [Bindable] /*数据源绑定*/ private var pieArray:ArrayCollection = new ArrayCollection([ {label:"一月",value:"891541"}, {label:"二月",value:"451542"}, {label:"三月",value:"784455"}, {label:"四月",value:"698988"}, {label:"五月",value:"321545"}, {label:"六月",value:"154512"}, {label:"七月",value:"265455"}, {label:"八月",value:"98988"}, {label:"九月",value:"784544"}, {label:"十月",value:"987844"}, {label:"十一月",value:"356522"}, {label:"十二月",value:"894556"} ]); [Bindable] /*饼图属性绑定*/ private var params:ArrayCollection = new ArrayCollection([ {baseFontSize:"12"}, {caption:"2013年某桥每月通过的人数统计"}, {showBorder:"1"}, {borderColor:"#00FF00"}, {bgColor:"#0000FF"}, {showLegend:"1"}, {legendShadow:"1"}, {legendAllowDrag:"1"}, {dashed:"1"}, {showToolTip:"1"}, {legendNumColumns:"6"}, {showPercentValues:"1"}, {baseFontColor:"#FF0000"}, {showValue:"1"} ]); /*声明timer,并且设置成10秒*/ private var timer:Timer = new Timer(10000); /*初始化函数*/ protected function initHandler():void { timer.addEventListener(TimerEvent.TIMER,timerHandler); timer.start(); } /*timerHandler处理函数*/ private function timerHandler(evt:TimeEvent):void { for(var i:int = 0;i<pieArray.length;i++) { pieArray[i].value = int(pieArray[i].value) + int(Math.random()*1000000); } pieArray.refresh(); hbox.removeAllChildren(); var fusionCharts:FusionCharts = new FusionCharts(); //fusionCharts.FCData(pieArray); //fusionCharts.FCChartType = "Pie2D"; fusionCharts.percentWidth = 100; fusionCharts.percentHeight = 100; hbox.addChild(fusionCharts); } ]]> </fx:Script> <mx:HBox width="100%" height="100%" id="hbox"> <components:FusionCharts width="100%" height="100%" FCChartType="Pie2D"> <components:FCChartData FCData="{pieArray}" FCParams="{params}" id="pieData"/> </components:FusionCharts> </mx:HBox> </s:Application>
3、设计结果
Flex中的FusionCharts 2D饼图的更多相关文章
- Flex中的FusionCharts 2D面积图
Flex中的FusionCharts 2D面积图 1.源码 <?xml version="1.0" encoding="utf-8"?> <s ...
- Flex中的FusionCharts 2D折线图
Flex中的FusionCharts 2D折线图 1.设计源码 LineChart.mxml: <?xml version="1.0" encoding="utf- ...
- Flex中的FusionCharts 2D柱形图
1.2D柱形图源码 <?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:f ...
- Flex中的FusionCharts 3D饼图
1.3D饼图设计源码 <?xml version="1.0" encoding="utf-8"?> <s:Application xmlns: ...
- Flex中配置FusionCharts
Flex中配置FusionCharts 1.配置前说明 (需要的工具和插件) 1.1 MyEclipse10.0 1.2 Flash Builder4.0 1.3 FusionCharts ...
- Flex中的FusionCharts 四图监听
<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="ht ...
- Flex中的FusionCharts 3D柱形图
1.3D柱形图源码 <?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:f ...
- Flex中设置Camera的视频清晰质量的最佳配合
今天需要设置Flex中的Camera组件的一些属性,后来发现清晰度不是很高,于是捣鼓了上午半天,设置了很多的参数,竟然发现手册上就是有现成的一些设置方法,郁闷!不过我还是专门设置了几个有用和必要的属性 ...
- ArcGIS for Flex中引入google map作底图
上篇文章到在ArcGIS View中引入google map,这里讲ArcGIS for Flex中引入google map作底图. 同样道理,以google map作底图,需要编写继承自TiledM ...
随机推荐
- VS工程中的Windows.h
才发现这个Windows.h是有些奥秘的,不是随便引用就可以的. 1,C++工程,头文件引用要讲求一定顺序.如果cpp文件先引用a.h,再引用b.h,则后者自动包含a.h.这一点很重要. 2,Wind ...
- spring之p命名空间注入
<bean id="personId" class="com.itheima.f_xml.c_p.Person" p:pname="禹太璞&qu ...
- mkdir与mkdirs的区别
mkdir与mkdirs的区别 项目中需要在代码中读取或创建文件保存路径,用到了mkdir,查看还有个mkdirs方法,这里记录一下两者的区别. 1.关于两者的说明如下: boolean mkdir( ...
- 01 Java 搭建环境
刚接触 Java 语言,为了方便以后查阅,将学习过程中遇到的知识点记录下来,作为学习笔记使用.在学习过程中 JDK 使用版本为 1.8.0_73,操作系统为 macOS Sierra 10.12.6. ...
- 洛谷 [P2661] 信息传递
求有向图的权值为一的最小环 并查集做法 维护一个dis[],表示i号元素到fa[i]的距离. 对于输入的每两个点u,v,询问这两个点的fa[]是否相同,如果相同就成环,维护最小值,mi=min(mi, ...
- bzoj 4836: 二元运算
死活TLE....求助 update 4.3 23:08 求助了tls之后终于过了...分治里次数界写崩了...r-l+1就行... 分治的做法很神奇!本题的限制在于操作类型与权值相对大小有关,而用[ ...
- BZOJ 3720: Gty的妹子树 [树上size分块]
传送门 题意: 一棵树,询问子树中权值大于$k$的节点个数,修改点权值,插入新点:强制在线 一开始以为询问多少种不同的权值,那道CF的强制在线带修改版,直接吓哭 然后发现看错了这不一道树上分块水题.. ...
- BZOJ 2882: 工艺 [后缀自动机+map]
Description 小敏和小燕是一对好朋友. 他们正在玩一种神奇的游戏,叫Minecraft. 他们现在要做一个由方块构成的长条工艺品.但是方块现在是乱的,而且由于机器的要求,他们只能做到把这个工 ...
- gitlab wiki 500
记录一次使用gitlab各种报500的问题,并怎么解决的描述下 一.问题背景 描述我第一次使用wiki的步骤: 二.问题描述 之后我进行任何合法的操作(创建页面使用全英文名称:页面不做任何修改,只是点 ...
- Nginx日志分析及脚本编写
在我们日常的运维中,当Nginx服务器正常运行后,我们会经常密切关注Nginx访问日志的相关情况,发现有异常的日志信息需要进行及时处理. 那今天我将跟大家一起来研究和分析Nginx日志,nginx默认 ...