Chart.JS 条形图鼠标悬停和鼠标悬停事件？答案

【问题标题】：Event on Chart.JS's Bar Chart's mousein and mouseout?Chart.JS 条形图鼠标悬停和鼠标悬停事件？
【发布时间】：2018-02-13 15:32:56
【问题描述】：

我已经搜索了 bar chart 和 event 文档（我觉得有点混乱），但我无法弄清楚当悬停在条形图的条上时如何处理 mousein 和 mouseout 事件（不是传说！）。目前我能做到的最接近的方法是使用工具提示上的回调，如下所示：

options.tooltips = {
    backgroundColor: 'rgba(0,0,0,0)',
    fontColor: 'rgba(0,0,0,0)',
    callbacks: {
        label: function (tooltipItem) {
            // flipping a bool here
        }
    }
};

此解决方案效果不佳，因为不知道指针何时离开栏，我不知道何时将布尔值翻转回来。这可能吗？

【问题讨论】：

标签： javascript chart.js chart.js2

【解决方案1】：

这是我的问题的解决方案：

options.tooltips = {
    // Hide the tooltips
    backgroundColor: 'rgba(0,0,0,0)',
    displayColors: false,
    callbacks: {
        labelTextColor: function () {
            return 'rgba(0,0,0,0)';
        },
        labelColor: function () {
            return {
                borderColor: 'rgba(0, 0, 0, 0)',
                backgroundColor: 'rgba(0, 0, 0, 0)'
            }
        }
    },
    // Highlight the HTML elements on bar hover
    custom: function(tooltipModel) {

        if (tooltipModel.body === undefined) {
            // flip bool false
            return;
        }

        if (/* ... */) {
            // flip bool true
        }

        return;
    }
};

【讨论】：