Echarts柱状图实现点击事件

本次实现的是点击黄绿色的柱显示对应的人员弹窗，通过打印params值确定了每个柱子的区分字段如下：

       var _this = this;myChart.on("click", function (params) {//因为我的蓝色柱子不点击，所以添加了条件if (params.seriesIndex > 0) {_this.userDialogVisible = true;//seriesIndex:0 蓝色柱子1 绿色柱子 2 黄色柱子//dataIndex:0 单位 1 个人//调用方法_this.$refs.listUser.showNoActiveUser("",params.dataIndex,params.seriesIndex);}});

实现的过程也遇到过问题，因为是用了一个方法初始化的柱状图和点击事件，直接通过this调用字段访问不到，需要用在外部定义 _this指向this，才能实现，具体原理不太了解。

Echarts柱状图实现点击事件相关推荐

Echarts柱状图的点击事件
最近在做一些图表统计的功能,用到了百度的开源图表软件Echatrs,不得不提的是:不但上手简单而且扩展功能也是十分强大.在使用的过程中也遇到了不少问题,可能由于有关Echatrs的资料并不是很齐全,所 ...
Echarts柱状图柱子点击事件
文章目录效果展示需求实现效果展示需求点击柱子显示当天的详细数据实现这里只需要拿到被点击柱子对应的X轴时间坐标,可以直接监听click事件在DOM加载完为chart注册点击事件拿到被 ...
vue组件-echarts地图显示柱状图并给柱状图添加点击事件（支持自定义地图）
vue组件-echarts地图显示柱状图并给柱状图添加点击事件(支持自定义地图) 效果如下所示: 参考文档: 这是参考的文档起因: 最近有朋友有需求需要用echarts,在地图上显示柱状图,并添加点 ...
echarts 地图 scatter点击事件_React实现高亮可点击地图
目前越来越多的项目中开始使用地图,而对地图的需求也不仅仅是简单的纯展示,更多了各种各样的交互功能.今天这篇文章主要介绍的就react中通过Echarts实现一个高亮可点击的省市地图.接下来先看看效果图 ...
echats 柱状图的点击事件及高亮
点击柱状图触发事件及双击柱状图高亮 <!DOCTYPE html> <html> <head><meta charset="utf-8"& ...
Echarts树形结构图加点击事件
一.引入js 二.前端 <div id="statisticChart" style="height:800px"></div> // ...
vue中echarts纵轴添加点击事件
直接上代码 initChart () {this.ganttChart = echarts.init(document.getElementById('gantt-chart'))const _sel ...
echarts 地图去除点击事件_ECharts地图区域处理事件
ECharts 中有两种方式的地图区域处理: 一种是在 geo 中: 另一种是在 series-map 中 geo 的情况下 : events.geoselectchanged | Event ...
【Echarts图例点击事件】自定义Echarts图例legend点击事件（已解决）
目录先睹为快(效果) 1.实现Echarts多条曲线 2.点击echarts触发接口请求 2.1 先默认隐藏部分数据 2.2 自定义legend图例点击事件 3.源码下载地址(解压即用) **[写在 ...

Echarts柱状图实现点击事件

Echarts柱状图实现点击事件相关推荐

最新文章

热门文章