如何获取在 plot.ly JS 的图例中单击了哪个跟踪

Posted 2023-02-18

【中文标题】如何获取在 plot.ly JS 的图例中单击了哪个跟踪

【英文标题】：How to get which trace is clicked in legend in plot.ly JS

【发布时间】：2021-11-05 07:28:32

【问题描述】：

在 plot.ly 中，您可以为图例单击事件添加侦听器。如何找出我单击的图例中的哪条轨迹？举一个更具体的例子，假设我在一个折线图中有两条迹线（trace0，trace1）。当用户单击图例中的 trace0 时，我想显示一个警报“trace0”。同样，当用户单击图例中的 trace1 时，我想要一个警报说一些不同的东西。我可以很好地发出警报，但我找不到任何关于 plot.ly 如何识别图例中单击了哪个跟踪的文档。有什么帮助吗？

【参考方案1】：

根据documentation about Event Handlers，您可以使用data，其中包含有关事件的信息。

var trace1 = 
  x: [1, 2, 3, 4],
  y: [10, 15, 13, 17],
  type: 'scatter'
;

var trace2 = 
  x: [1, 2, 3, 4],
  y: [16, 5, 11, 9],
  type: 'scatter'
;

var data = [trace1, trace2];

Plotly.newPlot('myDiv', data);

var myPlot = document.getElementById('myDiv');

myPlot.on('plotly_click', function(data) 
    // get event information from data
    console.log(data);
);

CodePen