2.5.6. 序列图

使用 SerialChart 组件可以创建线图、区域图、列图、柱图、步进线图，平滑线图，烛台图以及蜡烛图。图表支持多坐标轴，坐标轴支持简单或者对数刻度，数据点可以等距/非等距展示或者基于时间线展示。

在线示例
line chart
Figure 19. 线图展示的序列图
在线示例
column chart
Figure 20. 列图展示的序列图

该组件的 XML 名称：chart:serialChart

数据绑定:

可以为图表指定一个 CollectionContainer。然后为 serialChart 元素定义 categoryField 属性，为嵌套的 graph 元素定义 valueField 属性：

<chart:serialChart categoryField="date"
                   dataContainer="dateValueDc">
    <chart:graphs>
        <chart:graph valueField="value"
                     balloonText="[[value]]">
        </chart:graph>
    </chart:graphs>
    <chart:categoryAxis dashLength="1"
                        minorGridEnabled="true"/>
</chart:serialChart>
SerialChart 事件监听器

  • AxisZoomListener – 图表坐标轴缩放

  • CategoryItemClickListener – 在分类轴点击一个分类

  • ChartClickListener – 点击画布

  • ChartRightClickListener – 右键点击画布

  • CursorPeriodSelectListener – 用光标选择显示周期

  • CursorZoomListener – 用光标对图表区域进行缩放

  • GraphClickListener – 点击一个图形

  • GraphItemClickListener – 点击一个图形条目

  • GraphItemRightClickListener – 右键点击一个图形条目

  • RollOutGraphListener – 光标移出图形

  • RollOutGraphItemListener – 光标移出图形中的数据条目

  • RollOverGraphListener – 光标悬浮至图形

  • RollOverGraphItemListener – 光标悬浮至图形中的数据条目

  • ZoomListener – 画布的缩放

更多细节，参阅 AmCharts 文档