ECharts 点击图表时怎么复制值？

作者站长头像
站长
· 阅读数 5

echarts 5.5.0，我想当鼠标在图标在单击或双击时能复制x轴上的值。

ECharts 点击图表时怎么复制值？

如图当点击红色位置的时候，我想将左侧的281.11数值写入粘贴板。

这是我的代码

<body>
  <div id="main" style="width: 600px;height:400px;"></div>
  <script src="https://cdn.jsdelivr.net/npm/echarts@5.5.0/dist/echarts.min.js"></script>
  <script>
    var chartDom = document.getElementById('main');
    var myChart = echarts.init(chartDom);
    let option = {
      tooltip: { axisPointer: { type: 'cross' }, },
      xAxis: {
        type: 'category',
        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
      },
      yAxis: {
        type: 'value'
      },
      series: [
        {
          data: [150, 230, 224, 218, 135, 147, 260],
          type: 'line'
        }
      ]
    };

    myChart.setOption(option);

    // myChart.on('mousemove', 'tooltip.axisPointer', e => {
    //   console.log(e);
    // })

  </script>
</body>

请帮帮我，谢谢。

搜索相关问题，未找到答案

回复
1个回答
avatar
test
2024-06-20
myChart.getZr().on('click', e => {
  const [x, y] = myChart.convertFromPixel('grid', [e.offsetX, e.offsetY]);
})

echart 监听“空白处”的事件echart 像素转坐标值

回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引，对解决问题有帮助
  • 遵循 Markdown 语法排版，代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容