echarts组件自定义动作交互设置

自定义动作交互设置

1. 选中某个echarts组件，单击。
2. 在自定义动作中，单击“新增自定义动作”，修改动作名称为“设置数据高亮”。
   图1 新建自定义动作
   

3. 在动作实现中，输入如下代码，调用echarts提供的动作API。

   echartsInst.dispatchAction({
        type: 'highlight',
        dataIndex: params.dataIndex,
    });

4. 单击“新增参数”，设置参数名称为“dataIndex”。
   图2 新增dataIndex字段
   

5. 选中echarts组件，单击，进入组件交互页面。
6. 在作为触发器中，单击“交互事件”，选择“组件加载”。
7. 在响应动作中，单击“响应动作”，选择“组件响应”。
8. 在动作详情中，“响应组件”选择echarts组件，“响应动作”选择“设置数据高亮”，“dataIndex”设置为“0”。
   图3 设置动作详情
   

9. 保存交互设置，预览页面，echarts组件渲染首个数据获得高亮效果。
   图4 查看渲染效果