highcharts customize tooltip for a single point

customization, highcharts, tooltip

Solution

The formatter function doesn't seem to work when it's defined for a series. You can check which series you are in by using this.series.name and then you can check if you are on the final point using this.series.xData.length - 1 == this.point.x. But, it would be easier to name the point that you want to target and check for that in the formatter function. http://jsfiddle.net/Swsbb/. To see all the formatter data, check here http://api.highcharts.com/highcharts#tooltip.formatter.

$('#container').highcharts({   
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul']
    },
    tooltip : {
        formatter: function() {
            var tooltip;
            if (this.key == 'last') {
                tooltip = '<b>Final result is </b> ' + this.y;
            }
            else {
                tooltip =  '<span style="color:' + this.series.color + '">' + this.series.name + '</span>: <b>' + this.y + '</b><br/>';
            }
            return tooltip;
        }
    },   
    series: [{
                data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, {y:135.6, name: 'last'}]

    },
    {
        data: [194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2]
    }]

});

Problem

I want to customize the tooltip of the last point in a specific series, leave other points in this series, and other series, with default tooltip format. Basically, I am looking for something similar to this config. Thanks in advance for your help! ``` series: [{ tooltip: { // ?? tooltip does not work inside series formatter: function() { if (lastPoint in the series) { // ?? how to determine if lastPoint return '<b>Final result is </b> ' + this.y; } // ?? return default format if it is not the last point in the series } }, data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6] }, { data: [194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2] }] ```

Original source