HighCharts: Hide tooltip when value is zero when using 'split: true'

Question

I have a HighChart as below:

    new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'line'
        },
        title: {
            text: 'Monthly Average Temperature'
        },
        xAxis: {
            categories: ['aa', 'bb', 'cc']
        },
        yAxis: {
            title: {
                text: 'Infor'
            }
        },
        tooltip: {
                split: true,
        },
        plotOptions: {
            line: {
                dataLabels: {
                    enabled: true
                }
            }
        },
        series: [{
            name: 'a',
            data: [1, 0, 2]
        }, {
            name: 'b',
            data: [0, 3, 5]
        }]
    });

I've used config: tooltip: {split: true}.

I want to hide the tooltip if the value is zero.

Example the series with name='a' will hide the second tooltip but with name='b' still keep showing.

Or the series with name='b' will hide the first tooltip but with name='a' still keep showing.

Thank you very much!

Answer 1

You can wrap Tooltip.prototype.renderSplit(points, labels) method, so it will not create a tooltip for a point with value equaled 0.

The wrapper might look like below (it hides only the first point with value 0):

Highcharts.wrap(Highcharts.Tooltip.prototype, 'renderSplit', function (p, labels, points) {
var i = 0, len = points.length, point, label, modified = false;
for (; i < len; i++) {
  if (points[i].y === 0) {
    point = points.splice(i, 1)[0];
    label = labels.splice(i + 1, 1)[0];
    modified = true;
    break;
  }
}

p.call(this, labels, points);

if (modified) {
  points.splice(i, 0, point);
  labels.splice(i + 1, 0, label);
}
});

example: http://jsfiddle.net/vjusg30a/

Answer 2

To Hide tooltip for all 0 value from the chart series you can use below code

Highcharts.wrap(Highcharts.Tooltip.prototype, 'renderSplit', function (p, labels, points) {
var modified = false;
if  (modified== false){
var i = points.length;
while (i--) {

    if (points[i].y  == 0) {
        points.splice(i, 1);
        labels.splice(i+1, 1);
    }
  }
}    
modified =true;
p.call(this, labels, points);

});

I've also created the JSfiddle Demo

Hope it will help other people, who are looking to remove all zeros from the series to hide the tooltip.