使用Flex图表组件

原文 http://blog.csdn.net/mylxiaoyi/article/details/1618470

使用Flex图表组件

以图表或是图的方式显示数据的能力可以使得Flex程序用户的数据交互更为容易。与仅显示简单的数字数据表不同,我们可以显示条状图,饼图,线图或是其他类型的图表,并且可以使用颜色,标题以及二维图形来表示我们的数据。
在这一部分我们会介绍Flex图表,菜单数据,以及我们可以在Flex中创建的其他类型的图表。

关于图表
数据表示可以使得我们简化数据表示与数据关系的方式来表示数据。图表是数据的一种类型,从而我们可以使用二维的图形来表示我们的数据。Flex支持最常见的二维图形,例如条状图,柱状图,饼图,并且提供给我们对于图表显示的的极大控制。
一个简单的图表显示单一的数据系列,在这里系列是一组相关的数据点。例如,一个数据系列也许是月度销售收益,或者是一天的旅馆占有率。下面的图表显示了过去六个月的与销售收益相应的数据系列:

另一种图表也许会添加第二个数据系列。例如,我们也许会包含过去六个月的利润。下面的图表显示了两个数据系列,一个是销售,一个是利润:

 

定义图表数据
图表控件使用为图表定义数据的dateProvider属性。一个数据提供者(date provider)是一个对象的集合,与数组类似。图表组件使用平的,或者是基于列表的,数据提供者,与一维数组类似。
一个数据提供者由两部分组成:一个数据对象集合与API。数据提供者API是一个类必须实现的方法与属性的集合,从而Flex组件可以将其看作数据提供者。

图表类型
Flex支持最常见的一些图表类型,包括条状图,线图,饼图以及其他的类型。这一部分描述Flex所提供的图表集合。除了这些图表类型以外,我们还可以扩展笛卡尔图表控件还创建自定义的图表。

区域图表
我们使用图表控件将数据表示为一个用与数据值相关的线来界定的区域。在线以下的区域用一种颜色或是一种类型来进行填充。我们可以用图标或是符号来表示线上的每一个数据点,或者是不使用图标而仅用单一的线。
下图是一个区域图表的例子:

 

条状图
我们使用条状图控件来将数据表示为一系列的垂直条,垂直条的长度由数据值为决定。我们可以使用条状图控件来表示图表的多样性。
条状图实际上是柱状图顺时针旋转90度。所以条状图与柱状图有着许多同样的特性。

泡沫图
我们使用泡沫图对于每一个数据点用三个值来表示数据:一个值决定他的X位置,一个值决定他的Y位置,而另一个值来决定图表符号图表上相对于其他数据点的尺寸。
<mx:BublleChart>标签还有一个额外的属性,maxRadius。这个属性以象素值指定了最大的图表元素的最大半径。与最大值相关的数据点赋值为这个半径值,而其他的数据点相对于最大值赋值为一个较小的半径值。默认值为30象素。
如下图为一个泡沫图的例子:

 

烛台图表
CandlestickChart控件将财经数据表示为一个系列的烛台,来表示数
据系列的高,低,开放与关闭的值。烛台上每一个垂直线的最高点与最低点表示数据点的最大值与最小值,而整个盒的最高点与最低点代表数据的开放值与关闭值,
每一个烛台的不同填充由数据点的关闭值是否高于或是低于开放值来决定。
如下图是一个烛台图表的例子:

 

列状图
ColumnChart控件将数据表示为一系列的垂直列,他的高度由数据值为决定。我们可以使用ColumnChart控件来创建各种类型的列状图,包含简单列,簇列等。
一个简单的图表显示一个单一的数据系列,在这里系列是一组相关的数据点。例如,一个数据系列也许是每个月的销售收益,或者是每天的旅馆出租率。下面的图表显示了一个相应于过去四个季度的销售增长比例的数据系列:

HighLowOpenClose图表
HLOCChart控件将财经数据表示为一系列的代表高,低,开放与关闭的数据系列值。垂直线的最高点与最低点代表数据点的最高值与最低值,而左边的符号标记代表值的开始点,右边的符号标记代表值的结束点。
HLOCChart
控件并不需要代表开始值的数据点。相关的图表CandlestickChart将简单的数据表示为烛台。我们使用HLOCSeries配合
HLOCChart控件来为HighLowOpenClose图表定义数据。下面的例子显示了一个HighLowOpenClose图表:

 

线图
LineChart控件将数据表示为了笛卡尔坐标系列中的一系列点,彼此之间由连续的线进行连接。 我们可以使用图标或是符号来表示线上的每一个数据点,或者不使用图标显示简单的线。
下图是一个简单的线图的例子:

 

饼图
我们可以使用PieChart来定义一个标准的饼图。数据提供者的数据决定饼图中相对于其他边的每一个边的尺寸。
下图是一个简单的饼图的例子:

Flex可以让我们创建圆环图。圆环图与饼图相同,所不同只是前者有一个空心与类似轮子的形状,而不是填充的圆。下图是一个简单的圆环图的例子:

块图
我们使用PlotChart控件来在笛卡尔坐标系中表示数据,其中每一个数据点有一个决定其位置的X坐标与Y坐标。我们可以定义Flex所显示的每一个数据点的形状。
下图是一个简单的块图的例子:

 

时间: 2024-12-02 12:39:10

使用Flex图表组件的相关文章

Flash Flex服务组件大排行

本文列出了一些Flash Flex后端支持的项目和组件.这些Flex服务组件轻量快捷,可实现很多与后台交互的功能. 不是有人说Flash Flex没有后端支持么,现在,咱列个清单出来. AMF Projects轻量级 在众多知名的后台语言上,Flash和Flex开发人员除了可以使用标准的XML/E4X/Socket去请求非序列化的外部服务数据之外,还有一个轻量快捷的通讯机制,使用AMF (Action Messaging Format),你可以访问opensource.adobe.com去找到关

构建可扩展的Java图表组件

前言 Java语言所具有的面向对象特性,使许多复杂的问题可以分解成相对独立的对象来处理.本文用面向对象的方法,将一个图表组件从分解到如何组合,以及如何进行扩展作了详细的讲解.从简单的折线图到稍复杂的多种形状组合的图表,读者可以学到构建一个可扩展的图表组件是多么的容易. 常见的图表类型 图表具有很直观的视觉效果,可以方便的用来比较数据的差异.图案和趋势等. 从外观上来看,常用到的图表主要有散点图.(折)曲线图.柱状图等.本文主要讨论这几种图形样式.其中这每种图又可以与其它的类型组合产生更多的形式.

浅析jquery的js图表组件highcharts

 本篇文章主要是对jquery的js图表组件highcharts进行了详细的介绍,需要的朋友可以过来参考下,希望对大家有所帮助 Highcharts是一个制作图表的纯Javascript类库,   主要特性如下:   兼容性:兼容当今所有的浏览器,包括iPhone.IE和火狐等等:   对于非商用用户免费(包括个人网站.非盈利性组织.学生团体等).   纯JS,无BS:   支持大部分的图表类型:直线图,曲线图.区域图.区域曲线图.柱状图.饼装图.散布图:   跨语言:不管是PHP..net还是

Flex自定义组件开发之日周月日期选择日历控件

原文:Flex自定义组件开发之日周月日期选择日历控件           使用过DateField的我们都知道,DateField 控件是用于显示日期的文本字段,字段右侧带有日历图标.当用户在控件边框内的任一位置单击时,将弹出一个 DateChooser 控件,显示当月的所有日期.如果未选择日期,则该文本字段为空白,并且 DateChooser 控件中将显示当前日期的月份.当 DateChooser 控件处于打开状态时,用户可以在各个月份和年份之间滚动,并选择某个日期.选择日期后,DateCho

flex 自定义组件事件问题

问题描述 flex 自定义组件事件问题 实现功能:定义自定义组件中mx:Image控件的鼠标经过事件: 自定义组件(名称为Component1.mxml)主要代码: <fx:Script> private function mouseover(event:MouseEvent):void { //分发(广播)事件;当点击登录按钮时就触发了这一事件 var e:MyEvent= new MyEvent(MyEvent.myMOUSEOVER); this.dispatchEvent(e); }

flex 自定义组件 问题 急急急急

问题描述 flex 自定义组件 问题 急急急急 flex做的自定义组件DataField,边框不显示怎麽办?

几个.NET开源图表组件

推荐几个.NET开源图表组件,希望大家发行有其它的可以添加一下,说明:因为没有记录在哪里下载,所以大部分只能让大家亲自搜索一下: 1.NPlot:http://netcontrols.org/nplot/:我觉得是.NET开源轻量级中最好的:) 2.graphviz(quickgraph):这个大家可以搜索一下,功能很强大(看介绍和图片),就是没有调试通过,呵呵. 3.ZedGraph:原题"A flexible line graph class library in C#",http

Flex自定义组件外观

Flex 是现今最受欢迎的 RIA 开发技术之一,它凭借其优秀的用户体验获得 许多用户的青睐,因此也吸引了众多的程序员投入 Flex 学习的洪流之中.Flex 之所以如此受欢迎,一大部分原因是因为 Flex 的界面效果非常出众.Flex 提 供了自定义组件外观的众多方法,使得 Flex 程序界面丰富多彩.本文通过简单 实用的程序例子(包括冒泡信息提示框.图像圆角.动态按钮.网格背景),使 用位图.矢量图.SWF 文件自定义皮肤,使用 Mask 制作遮掩效果,讲解了其中 几种自定义组件外观方法的优

flex LineChart组件的问题,哪位大侠知道帮帮忙..

问题描述 当LineChart组件的showDataTips为true的时候,鼠标靠到曲线的节点的时候会显示横轴和纵轴的值,横轴的值可以显示为字符串,为什么纵轴的值不能显示字符串而只能显示数字类型的呢,如果能的话我这样做:当我纵轴的实际值为任意一个数字比如95,我就用一个字符串如"excellent"来代替95显示,我该怎么做呢.. 哪位大侠知道帮帮忙啊..先谢谢了.. 解决方案 用 dataTipFunction="chartTip"来做 private func