大连网站建设资讯温州自助模板建站

触发图表行为，通过dispatchAction触发。例如图例开关legendToggleSelect, 数据区域缩放dataZoom，显示提示框showTip等等。

官网：echarts

(在 ECharts 中主要通过 on 方法添加事件处理函数。)

events：

ECharts 中的事件分为两种，一种是鼠标事件，在鼠标点击某个图形上会触发，还有一种是调用 dispatchAction 后触发的事件。

action：

ECharts 中支持的图表行为，通过 dispatchAction 触发。

1.highlight 高亮指定的数据图形

dispatchAction({type: 'highlight',// 可选，系列 index，可以是一个数组指定多个系列seriesIndex?: number|Array,// 可选，系列名称，可以是一个数组指定多个系列seriesName?: string|Array,// 可选，数据的 indexdataIndex?: number,// 可选，数据的 名称name?: string
})

2.downplay 取消高亮指定的数据图形

dispatchAction({type: 'downplay',// 可选，系列 index，可以是一个数组指定多个系列seriesIndex?: number|Array,// 可选，系列名称，可以是一个数组指定多个系列seriesName?: string|Array,// 可选，数据的 indexdataIndex?: number,// 可选，数据的 名称name?: string
})

3.图例相关的行为，必须引入图例组件之后才能使用

1）legendSelect（选中图例）

dispatchAction({type: 'legendSelect',// 图例名称name: string
})

2）legendUnSelect（取消选中图例

dispatchAction({type: 'legendUnSelect',// 图例名称name: string
})

3）legendToggleSelect（切换图例的选中状态）

dispatchAction({type: 'legendToggleSelect',// 图例名称name: string
})

4）legendScroll（控制图例的滚动），当legend.type是scroll的时候有效

dispatchAction({type: 'legendScroll',scrollDataIndex: number,legendId: string
})

4. 提示框组件相关行为，必须引入提示框组件之后才能引用

1）showTip（显示提示框）
有两种使用方式
A：指定在相对容器的位置处显示提示框，如果指定的位置无法显示则无效。

dispatchAction({type:'showTip',//屏幕上的x坐标x: number,//屏幕上的y坐标y: number,//本次显示tooltip的位置，只在本次action生效。缺省则使用option中定义的tooltip位置position: Array.<number> | String | Function
})

B: 指定数据图形，根据tooltip的配置项进行显示提示框

dispatch({type: 'showTip',// 系列的 index，在 tooltip 的 trigger 为 axis 的时候可选。seriesIndex?: number,// 数据的 index，如果不指定也可以通过 name 属性根据名称指定数据dataIndex?: number,// 可选，数据名称，在有 dataIndex 的时候忽略name?: string,// 本次显示 tooltip 的位置。只在本次 action 中生效。// 缺省则使用 option 中定义的 tooltip 位置。position: Array.<number>|string|Function,
})

2）hideTip 隐藏提示框

dispatchAction({type:'hideTip'
})

其他相关方法或者属性 可以移步官网。此文借鉴：Echarts 的 dispatchAction