单击图例时如何突出显示chart.js堆积条形图中的条形

Question

我有一个堆积的条形图，我想在单击该颜色的图例时突出显示这些条形。说，如果我单击颜色为“绿色”的图例，我想通过将边框颜色设置为某种不同的颜色和宽度来突出显示绿色的所有条形。

有人可以帮助我实现这一目标吗？

Answer 1

您可以通过此代码获得点击的图例。然后您可以选择相同的图例。我在SO的帮助下创建了类似的内容。

var canvas = document.getElementById('yourChartDiv'); 
var myChart = new Chart(canvas, chartData);


canvas.onclick = function(evt) {
   var activePoint = myChart.getElementAtEvent(evt)[0];
   var data = activePoint._chart.data;
   var datasetIndex = activePoint._datasetIndex;
   var lagend = data.datasets[datasetIndex].label; 
   //var value = data.datasets[datasetIndex].data[activePoint._index];
};

console.log(legend); // here is the legend

//Now select the bars with same legend.

希望至少可以得到一个线索。