Chart.js 仅在一个数据集上禁用chartJS工具提示

Chart.js 仅在一个数据集上禁用chartJS工具提示,chart.js,Chart.js,是否有一种方法可以禁用图表JS图表中一个数据集上的工具提示,并将工具提示保留在另一个数据集上。这是我目前的代码: var data = { labels: [' . $labels . '], datasets: [ { label: "Portfolio Performance",

是否有一种方法可以禁用图表JS图表中一个数据集上的工具提示,并将工具提示保留在另一个数据集上。这是我目前的代码:

var data = {
                    labels: [' . $labels . '],
                    datasets: [
                        {
                            label: "Portfolio Performance",
                            fillColor: "rgba(0,0,220,0.2)",
                            strokeColor: "rgba(0,220,220,1)",
                            pointColor: "rgba(0,0,0,1)",
                            pointStrokeColor: "#fff",
                            pointHighlightFill: "#fff",
                            pointHighlightStroke: "rgba(220,220,220,1)",
                            data: [' . $values . ']
                        },
                        {
                            label: "Portfolio Expendature",
                            fillColor: "rgba(0,0,220,0)",
                            strokeColor: "rgba(0,0,0,1)",
                            pointColor: "rgba(0,0,0,0)",
                            pointStrokeColor: "rgba(0,0,220,0)",
                            pointHighlightFill: "rgba(0,0,220,0)",
                            pointHighlightStroke: "rgba(220,220,220,0)",
                           data: [4450000,4450000,4450000,4450000,4450000]
                        }
                    ]
                };
                var option = {
                    tooltipTemplate: "<%if (label){%><%=label%>: <%}%><%=  \'£\' + FormatNumberBy3(Number(value).toFixed(2), \'.\' , \',\')  %>",

                    maintainAspectRatio: false, 
                    bezierCurve: false,
                    responsive: true,
                    scaleLabel: "<%= \'£\' + FormatNumberBy3(Number(value), \'.\' , \',\') %>"
                };

                var ctx = document.getElementById("graph").getContext("2d");
                var myLineChart = new Chart(ctx).Line(data, option);
var数据={
标签:['.$labels.'],
数据集:[
{
标签:“投资组合绩效”,
填充颜色:“rgba(0,0220,0.2)”,
strokeColor:“rgba(0220220,1)”,
pointColor:“rgba(0,0,0,1)”,
pointStrokeColor:“fff”,
pointHighlightFill:“fff”,
pointHighlightStroke:“rgba(2201)”,
数据:['.$values']
},
{
标签:“投资组合支出”,
填充颜色:“rgba(0,0220,0)”,
strokeColor:“rgba(0,0,0,1)”,
pointColor:“rgba(0,0,0,0)”,
pointStrokeColor:“rgba(0,0220,0)”,
pointHighlightFill:“rgba(0,0220,0)”,
pointHighlightStroke:“rgba(2200,0)”,
数据:[44500004450000445000044500004450000]
}
]
};
var选项={
ToolTiptTemplate:“:”,
MaintaintAspectRatio:false,
贝塞尔曲线:错,
回答:是的,
scaleLabel:“
};
var ctx=document.getElementById(“图形”).getContext(“2d”);
var myLineChart=新图表(ctx).Line(数据,选项);

您可以使用自定义工具提示来执行此操作(基本上,您使用HTML元素而不是使用画布来单独呈现工具提示)。有关折线图的示例,请参见


在您的情况下,您可以在处调整循环以排除/包括您认为合适的数据集。

我使用自定义工具提示配置来实现这一点(这里它隐藏了没有“收入”标签的数据集):

this.myChart = new Chart(this.ctx, {
        type: 'bar',
        data: {
            labels: labels,
            datasets: [{
                    label: "Income",
                    data: data3
                },
                {
                    label: "Tax",
                    data: data1,
                    backgroundColor: "#3EAFD5"
                },
                {
                    label: "Expenses",
                    data: data2,
                    backgroundColor: "#D24B47"
                }
            ]
        },
        options: {
            responsive: true,
            tooltips: {
                custom: function(tooltipModel) {
                    if (tooltipModel.body && tooltipModel.body[0].lines && tooltipModel.body[0].lines[0].indexOf("Income") == -1) {
                        tooltipModel.opacity = 0;
                    }
                }
            }
        }
    }