Question

我想在气泡图中的气泡上捕捉onlick事件。我想将点击的气泡标签记录到控制台中。我写了一个函数来完成这个实际上看起来像这个的工作

$("#myChart").click(function(evt) {
    var activePoints = myBubbleChart.getElementAtEvent(evt);
    console.log(activePoints.label);
});

每次点击气泡时，此功能都会记录＆＃34; undefined＆＃34;进入控制台。我甚至尝试了getBarsAtEvent和getSegmentsAtEvent没有一个有效。我的代码有什么问题？任何人都可以告诉我如何获得我点击的泡泡的标签值？

Answer 1

Chart.js选项有一个内置的onClick属性（参见documentation ）。

它的工作原理如下：

options: {
     onClick: function(e) {
        var element = this.getElementAtEvent(e);

        // If you click on at least 1 element ...
        if (element.length > 0) {
            // Logs it
            console.log(element[0]);

            // Here we get the data linked to the clicked bubble ...
            var datasetLabel = this.config.data.datasets[element[0]._datasetIndex].label;
            // data gives you `x`, `y` and `r` values
            var data = this.config.data.datasets[element[0]._datasetIndex].data[element[0]._index];
        }
    }
}

检查this jsFiddle以获取完整示例。

如何在气泡图上捕获onClick事件？

1 个答案: