获取 yLabel 值 onclick 图表 js

Question

当我点击栏时，我想要 y 标签值。

就像上面的例子一样，当我点击二月蓝色条时，我想要标签值，即 40

我在 stackOverFlow 和其他网站上查找示例，但它们只显示了图例的标签示例。

我试过的一些代码

onClick: function(evt, element) {
      var activePoints = bar_chart.getElementAtEvent(evt);
      console.log(activePoints[0]._model.datasetLabel);
}

原文由 Amer Bearat 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

当您单击它时，此演示会在条形图中给出值。我不是 chart.js 专家，所以可能有更好的解决方案。

https://codepen.io/newschapmj1/pen/PerOzM

 /* from https://github.com/chartjs/Chart.js/issues/2292 */
document.getElementById("myChart").onclick = function (evt) {
        var activePoints = myChart.getElementsAtEventForMode(evt, 'point', myChart.options);
        var firstPoint = activePoints[0];
        var label = myChart.data.labels[firstPoint._index];
        var value = myChart.data.datasets[firstPoint._datasetIndex].data[firstPoint._index];
        alert(label + ": " + value);
    };

原文由 JohnC 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

Chart.js 版本 = 3.2.1

来自 官方文档：

 onClick: (evt) => {
    const points = myChart.getElementsAtEventForMode(evt, 'nearest', { intersect: true }, true);

    if (points.length) {
        const firstPoint = points[0];
        var label = myChart.data.labels[firstPoint.index];
        var value = myChart.data.datasets[firstPoint.datasetIndex].data[firstPoint.index];
        alert(label +" : "+ value);
    }
}

原文由 Mrunalraj Redij 发布，翻译遵循 CC BY-SA 4.0 许可协议