8. 图表事件对象

图表事件对象 用于定义和封装针对图表数据条目的交互事件信息(比如鼠标单击、双击、滑入、滑出等), 为图表联动图表事件处理等功能提供支持。

它的结构规范如下所示:

  1. {
  2. //事件类型,常用的事件类型包括:
  3. //"click"、"dblclick"、"mousedown"、"mouseup"、"mouseover"、"mouseout"
  4. type: "...",
  5. //用于绘制图表条目的数据对象
  6. data: 图表条目数据对象,
  7. //图表数据条目的原始数据,即绘制图表条目所使用的数据集结果对象中某一行的数据对象,或者多行的数据对象数组
  8. originalData: {...}、[ {...}, ... ],
  9. //图表数据条目的原始数据所对应的图表数据集数组中的索引数值
  10. originalChartDataSetIndex: 数值,
  11. //图表数据条目的原始数据所对应的数据集结果对象中的行索引数值,或者索引数值数组(与originalData一一对应)
  12. originalResultDataIndex: 数值、[ 数值, ... ],
  13. //图表对象
  14. chart: 图表对象,
  15. //图表类型,"echarts" Echarts图表;"html" HTML图表
  16. chartType: "...",
  17. //原始事件对象,通常是图表内部组件的事件对象,比如:
  18. //chartType为"echarts"时, 则是Echarts规范的事件处理函数参数对象(params);
  19. //chartType为"html"时,则是HTML事件对象
  20. originalEvent: {...}
  21. }

图表条目数据对象 是依据定义图表时的设置数据标记操作, 从数据集结果对象的数据中提取而得的,它的结构规范如下:

  1. {
  2. 数据标记英文名 : ...,
  3. ...
  4. }

例如,对于基本地图图表,设置的数据标记如下:

数据集列名数据标记
COL_NAME地区名称(name)
COL_VALUE指标数值(value)

那么,它的图表条目数据对象结构为:

  1. { name: "...", value: ... }

系统内置图表的图表条目数据对象大部分都是 数据标记英文名与标记列值一一对应的,有些图表则稍有特殊:

  • 雷达图(基本雷达图、圆形雷达图)
    图表条目数据对象的name、 value、max值是各指标对应列值的数组,各值数组的元素顺序与标记顺序一一对应。
  • 关系图(基本关系图、环形关系图、关系地图)、桑基图(基本桑基图、纵向桑基图)
    当触发的图表数据条目是节点而非关系连线时,图表条目数据对象仅会把数据赋值给 source*的数据标记英文名。
  • 表格(基本表格)
    图表条目数据对象的格式始终是: { column: […, …, …] },值数组的元素顺序与标记顺序一一对应。