[Chartjs]-Chart.js v2.0: Tooltip only for one dataset

1๐Ÿ‘

โœ…

You can just override the getElementAtEvent method of the chart object

var originalGetElementAtEvent = myChart.getElementAtEvent;
myChart.getElementAtEvent = function () {
    return originalGetElementAtEvent.apply(this, arguments).filter(function (e) {
        return e._datasetIndex == 0;
    });
}

where myChart is your chart object.


Fiddle โ€“ http://jsfiddle.net/x4shhvbk/

1๐Ÿ‘

I make use of the custom tooltip configuration to achieve this:

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

0๐Ÿ‘

It seems that this funcionality is not added to Chart.js.

I post my solution in this issue: https://github.com/chartjs/Chart.js/issues/1889

Leave a comment