添加echarts事件-vue

场景描述

echarts图表提供了很多事件，例如单击、图例切换等事件

实现思路

在echarts-vue组件的echarts事件属性（数组格式）中定义事件名及方法，格式如下：

[['事件名1', 方法名1],['事件名2', 方法名2]]

实现步骤

本例添加单击click和图例切换事件legendselectchanged，事件名称从echarts官网获取

1 设置echarts事件属性

在echarts组件的echarts事件属性中输入下面的代码

[['click', chartClick],['legendselectchanged', legendselectchanged]]

2 添加js方法

在js文件中添加chartClick和legendselectchanged方法，代码如下

let chartClick = (params) => {
    alert("click");
}

let legendselectchanged = (params) => {
    // 获取点击图例的选中状态
    var isSelected = params.selected[params.name];
    // 在控制台中打印
    console.log((isSelected ? '选中了' : '取消选中了') + '图例' + params.name);
    // 打印所有图例的状态
    console.log(params.selected);
}