echarts 点击柱状图获取索引以及数值的解决方案

最新推荐文章于 2024-07-18 15:15:36 发布

小航冲冲冲

最新推荐文章于 2024-07-18 15:15:36 发布

阅读量2k

点赞数

文章标签： echarts javascript 前端

本文链接：https://blog.csdn.net/weixin_45932821/article/details/131578792

版权

    let chart = echarts.init(document.getElementById('myChart'));
      chart.getZr().on('click', (e) => {
         this.options.series[0].data1 = this.options.series[0].data
       let pointInPixel = [e.offsetX, e.offsetY];
        if (chart.containPixel('grid', pointInPixel)) {
            let pointInGrid = chart.convertFromPixel({
                seriesIndex: 0
            }, pointInPixel);
            let xIndex = pointInGrid[0]; //索引
            let handleIndex = Number(xIndex);
            let seriesObj = chart.getOption(); //图表object对象
            var op = chart.getOption();
            //获得图表中点击的列
            var month = op.series[0].data[handleIndex];  //获取点击的列名
            console.log(op.series[0].data[handleIndex],'88888888888');
            console.log(handleIndex, seriesObj,'9999999999999');
            if (month.LGTD && month.LTTD)
            this.$store.commit("UPDATE_MAPLOCATION_COOR", [
              month.LGTD,
              month.LTTD
            ]);
        };
     
      })