如何为 Chart.js 工具提示标签设置颜色

Question

在 Chart.js 中，我无法为工具提示设置颜色。我想将标签“2016 年 12 月”的颜色与图例的颜色（蓝色）相同。

请看下文；

graphOptions.tooltips = {
                    enabled: true,
                    mode: 'single',
                    displayColors: false,
                    callbacks: {
                        title: function (tooltipItem, data) {
                            if (tooltipItem.length > 0) {
                                return tooltipItem[0].xLabel + ': ' + tooltipItem[0].yLabel +" Scans";
                            }
                            return "";
                        },
                        label: function (tooltipItem, data) {
                            if (data.datasets.length > 0) {
                                return data.datasets[tooltipItem.datasetIndex].label;
                            }
                            return '';
                        },
                        labelColor: function (tooltipItem, chartInstace) {
                            if (data.length > 0) {
                                return data[tooltipItem.datasetIndex].backgroundColor;
                            }
                        }
                    }
                };

Answer 1

您尚未定义回调函数data中labelColor调用的任何内容。charts.js 中与此回调的另一个混淆是传递给 labelColor 回调函数的第二个参数是图表实例，而不是像其他一些 chartjs 回调那样的数据集。

无论如何，这应该有效。

    labelColor: function(tooltipItem, chart) {
        var dataset = chart.config.data.datasets[tooltipItem.datasetIndex];
        return {
            backgroundColor : dataset.backgroundColor
        }
    }