Question

180

HighChart Shared Tooltip Number Formatting

rated 0 times [ 186] [ 6] / answers: 1 / hits: 18885 / 13 Years ago, wed, february 8, 2012, 12:00:00

I'm using HighCharts JS for the very first time. So far, I'm very impressed. I'm charting multiples series and using a shared tooltip. The numbers in the shared tooltip are correct, but they are not formatted as I would like. For example, I'm seeing 9876 instead of 9,876.

I know that I can use the formatter to completely customize the tooltip. Instead of completely redoing the tooltip, I'd just like to format the number and keep the existing look and feel.

Question: Is is possible to specify a format for the number(s) in the tooltip without writing a custom formatter?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

tiasavannahw

Add To Favorites

Follow

Total Points: 448

Total Questions: 122

Total Answers: 113

Location: Maldives

Member since Tue, Dec 21, 2021

2 Years ago

answered 13 Years ago janettejordynm · Accepted Answer

Unfortunately that's not possible, I am afraid: the default tooltip formatters are somewhat hidden inside the Point and Tooltip objects and do not provide access to the number formatting.

However, you may want to globally override the default implementation of a Point's tooltipFormatter with something of your own, e.g.

Highcharts.Point.prototype.tooltipFormatter = function (useHeader) {

    var point = this, series = point.series;

    return ['<span style=color:' + series.color + '>', (point.name || series.name), '</span>: ',

        (!useHeader ? ('<b>x = ' + (point.name || point.x) + ',</b> ') : ''),

        '<b>', (!useHeader ? 'y = ' : ''), Highcharts.numberFormat(point.y, 0), '</b>'].join('');

};

This implementation is the same as the default one except for the Highcharts.numberFormat call on the last line, which will do your number formatting.

Keep in mind that such a change will apply to all your charts.