echarts [Bug] Horizontal bar chart triggerEvent:true, the mouse gesture effect is invalid, and the binding event is not triggered.

Version

5.5.0

Link to Minimal Reproduction

none

Steps to Reproduce

option = {
  title: {
    text: 'World Population'
  },
  tooltip: {
    trigger: 'axis',
    axisPointer: {
      type: 'shadow'
    }
  },
  legend: {},
  grid: {
    left: '3%',
    right: '4%',
    bottom: '3%',
    containLabel: true
  },
  xAxis: {
    type: 'value',
    boundaryGap: [0, 0.01]
  },
  yAxis: {
    triggerEvent:true,
    type: 'category',
    axisLabel:{
      margin:6,
      width:140,
      overflow:'truncate',
      formatter:(value,index)=>{
        return `${value}`
      }
    },
    data: ['Brazil', 'IndonesiaIndonesiaIndonesiaIndonesia', 'USA', 'India', 'China', 'World'],
   
  },
  series: [
    {
      name: '2011',
      type: 'bar',
      data: [18203, 23489, 29034, 104970, 131744, 630230]
    }
  ]
};

use this options create eCharts Horizontal bar in Official Demo Site ，then yAxis mouse effect is invalid and the binding event is not triggered

Current Behavior

the mouse gesture effect is invalid, and the binding event is not triggered.

Expected Behavior

the mouse gesture effectand the binding event is triggered.

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

No response

Full Code

<!--
此示例下载自 https://echarts.apache.org/examples/zh/editor.html?c=bar-y-category&code=PYBwLglsB2AEC8sDeAoWtJgDYFMBcya6GOAHmAQOQDqwATlgCawAKoArlgIaQyVEBfADREwwYFkggCqYhjoQA5opx0qXUhADOlEXI3a2EaGFUyicsAE8Q-WJS0ALLo2AB3fnIGC9sXCuhGGWEiRQUgwjlcADMKewBmAFJdC1gFRUc4ygAWZN90ACNgMDEAWyoklLkAYxgwLmMAGS4CnCwCMDp2HB8iUgBBTS1zSxs7SgA3LixuquIi9kCuOisAcS5pWABtAAYhWB2AOh2ARgBdXvQrQe0R4k6lFToAUQmcEzxO7vyMMapqng4RT0KxzdAGLTNVrtWRyWClZaKYx4ABsP3QbggjDAjjwJ2ye1S6GAbzo0Sw7jwlC-0ABpjBxGi9ARJTMAAopjMcEJjIwyABKeAAPlhcLSODA7DocAABgASJCc7oCGVE2DeLw_Rg8LgELaUABCdC4AC8IFhdPYAJKBGA4LQQLg21zQe2O512h1O22ur2WygAVQAyv1_c7Hf6AMKOYxcf20BiMShnfKXWBaVQQe161Ki4jQLilcYAJlOJwZ6GstioBWWFdg2vqepOAA5S_F9sX4tkWwBOTu9nbd_YnHbZXsAdj2sBO8ROE-y2X2KPiOy7OwuXiIFwEAG4gA
⚠ 请注意，该图表不是 Apache ECharts 官方示例，而是由用户代码生成的。请注意鉴别其内容。
-->
<!DOCTYPE html>
<html lang="en" style="height: 100%">
<head>
  <meta charset="utf-8">
</head>
<body style="height: 100%; margin: 0">
  <div id="container" style="height: 100%"></div>

  
  <script type="text/javascript" src="https://registry.npmmirror.com/echarts/5.5.0/files/dist/echarts.min.js"></script>
  
  <!-- Uncomment this line if you want to dataTool extension
<script type="text/javascript" src="https://registry.npmmirror.com/echarts/5.5.0/files/dist/extension/dataTool.min.js"></script>
-->
  <!-- Uncomment this line if you want to use gl extension
<script type="text/javascript" src="https://registry.npmmirror.com/echarts-gl/2/files/dist/echarts-gl.min.js"></script>
-->
  <!-- Uncomment this line if you want to echarts-stat extension
<script type="text/javascript" src="https://registry.npmmirror.com/echarts-stat/latest/files/dist/ecStat.min.js"></script>
-->
  <!-- Uncomment this line if you want to use map
<script type="text/javascript" src="https://registry.npmmirror.com/echarts/4.9.0/files/map/js/china.js"></script>
<script type="text/javascript" src="https://registry.npmmirror.com/echarts/4.9.0/files/map/js/world.js"></script>
-->
  <!-- Uncomment these two lines if you want to use bmap extension
<script type="text/javascript" src="https://api.map.baidu.com/api?v=3.0&ak=YOUR_API_KEY"></script>
<script type="text/javascript" src="https://registry.npmmirror.com/echarts/5.5.0/files/dist/extension/bmap.min.js"></script>
-->

  <script type="text/javascript">
    var dom = document.getElementById('container');
    var myChart = echarts.init(dom, null, {
      renderer: 'canvas',
      useDirtyRect: false
    });
    var app = {};
    
    var option;

    option = {
  title: {
    text: 'World Population'
  },
  tooltip: {
    trigger: 'axis',
    axisPointer: {
      type: 'shadow'
    }
  },
  legend: {},
  grid: {
    left: '3%',
    right: '4%',
    bottom: '3%',
    containLabel: true
  },
  xAxis: {
    type: 'value',
    boundaryGap: [0, 0.01]
  },
  yAxis: {
    triggerEvent:true,
    type: 'category',
    axisLabel:{
      margin:6,
      width:140,
      overflow:'truncate',
      formatter:(value,index)=>{
        return `${value}`
      }
    },
    data: ['Brazil', 'IndonesiaIndonesiaIndonesiaIndonesia', 'USA', 'India', 'China', 'World'],
   
  },
  series: [
    {
      name: '2011',
      type: 'bar',
      data: [18203, 23489, 29034, 104970, 131744, 630230]
    }
  ]
};

    if (option && typeof option === 'object') {
      myChart.setOption(option);
    }

    window.addEventListener('resize', myChart.resize);
  </script>
</body>
</html>

echarts [Bug] Horizontal bar chart triggerEvent:true, the mouse gesture effect is invalid, and the binding event is not triggered.

Version

Link to Minimal Reproduction

Steps to Reproduce

Current Behavior

Expected Behavior

Environment

Any additional comments?

1条答案

相关问题

热门标签

最新问答