HighChart: Tooltip box thousand seperator

Question

I have create a scatter chart by highchart which need to display some data in a tooltip box.

Most of the numbers contain are big number therefore i'd like to add some number separator in between like the below

I have research some other posts saying i should do something like {point.x:.2f} but since i am getting all my data from a json file, i am not able to add any symbol to the orginal numbers.

The property of my chart's tooltip box looks like below:

//*highchart codes
    tooltip: {
                useHTML: true,
                headerFormat: '<table>',
                pointFormat: '<tr><th colspan="2"><h3>{point.name}</h3></th></tr>' +
                '<tr><th>Fan rate:</th><td>{point.y}</td></tr>' +
                '<tr><th>Coverage:</th><td>{point.x}</td></tr>' +
                '<tr><th>Volume:</th><td>{point.z}</td></tr>',
                footerFormat: '</table>',
                followPointer: true
            },

Answer 1

The reason why you have this gap between every thousand is lang.thousandsSep Highcharts parameter. Here you can find information about this parameter: http://api.highcharts.com/highcharts#lang.thousandsSep

As you can read here, this parameter defaults to ' '.

If you want to change this separator to comma, you can change it inside this parameter.

  Highcharts.setOptions({
    lang: {
      thousandsSep: ','
    }
  });

Here you can find live example how it can work: http://jsfiddle.net/uxx1ormz/1/

Best regards,