echart column is too short to be clicked

When doing echarts bar chart, sometimes there may be down-turning or some click functions, which are generally used myChart.on('click',function(){//执行代码})to realize the function. However, sometimes there may be too little data for a certain column, which may not be clicked. This is You can use myChart.getZr().on('click',function(){})to replace the previous click event, as follows:

myChart.getZr().on('click', function (p) {
   const pointInPixel = [p.offsetX, p.offsetY];
   if (myChart.containPixel('grid', pointInPixel)) {
     //执行代码
     console.log($this.tacitly.parma[0])
   }
});

This kind of event needs to be used with farmator in tooltip. Add the following code in option:

tooltip: {
       trigger: 'axis',
      formatter: function (p) {
          $this.tacitly.parma = p 
     }
},

这里的‘$this.tacitly.parma’Is a variable defined globally by myself, which can be defined according to the actual situation

Guess you like

Origin blog.csdn.net/BookstoreSpirit/article/details/108078856