AnyChart图表、仪表、地图控件是完全跨平台和跨浏览器的,所以是完全支持Flex平台的,前面我们已经详细介绍了怎么在Flex中使用AnyChart,现在我们简单看下AnyChart如何在Flex中使用图表提供的事件,进行一些交互式的操作,对数据进行一些处理。
在Flex中所有图表类型的事件处理方法都是一样的,无论是线性图表或是地图都是采用同样的方法,当用户点击数据点时可以得到数据点的所有信息,如:种类名, Y值, 数据序列名和所有点的自定义属性等。
可以通过下面的事件进行处理:
- pointClick – 当用户点击数据点时触发
- pointMouseOver –当用户鼠标移动到数据点时触发
- pointMouseOut – 当用户鼠标离开数据点时触发
- pointDoubleClick-当用户鼠标双击数据点时触发
当进行事件处理时,您需要先定义事件处理函数,这些事件必须要接收一个AnyChartPointEvent类的实列作为一个参数,下面是一段事例代码:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:ns1="com.anychart.*">
<ns1:AnyChartFlex x="10" y="10" width="472" height="401" id="sampleChart"
pointClick="onPointClick(event);"
pointMouseOver="onPointMouseOver(event);"
pointMouseOut="onPointMouseOut(event);"/>
<mx:Script>
<![CDATA[
import com.anychart.events.AnyChartPointEvent;
privatefunction onPointClick(event:AnyChartPointEvent):void {
trace(event);
}
privatefunction onPointMouseOver(event:AnyChartPointEvent):void {
trace(event);
}
privatefunction onPointMouseOut(event:AnyChartPointEvent):void {
trace(event);
}
]>
</mx:Script>
</mx:Application>
通过事件,我们一般可以得到如下一些常用信息:
属性名
|
XML节点或属性
|
描述
|
pointName
|
<point name="Jan"/>
|
类型:字符串,返回数据点的名字
|
seriesName
|
<series name="Product A"/>
|
类型:字符串,返回数据序列的名字.
|
y
|
<point y="215"/>
|
类型:数字,返回数据点的Y值
|
x
|
<point x="56"/>
|
类型:数字,返回数据点的X值
|
size
|
<point size="0.67"/>
|
类型:数字,返回气泡图数据点的气泡大小值
|
high
|
<point high="25.56"/>
|
类型:数字,返回气蜡烛图据点的高值
|
pointCustomAttributes
|
<point>
<attributes> <attribute name="id">45187</attribute> </attributes> </point> |
类型:对象,返回数据点的自定义属性
|
seriesCustomAttributes
|
<series>
<attributes> <attribute name="fullName">John Scott</attribute> </attributes> </series> |
类型:对象,返回数据序列的自定义属性
|
从上面的事例我们可以看出,通过Anychart提供的这些事件,我们可以在Flex得到曲线中数据点或者曲线的一些属性,然后进行一些相关的操作。
总的来说Anychart还是一款相当灵活,适用范围很广的图表类产品,可以满足各个领域的数据可视化需求。尤其是在Flex平台下图表产品比较匮乏的情况下,该产品无论从功能还是效果来看都是首选。