HighCharts - number format with $ in its short form

Question

I'm using dotnet.highcharts to generate a chart.

If I do not set any label formatting on the y-axis labels, this is what is displayed.

enter image description here

This is good. So 200M = 200,000,000 And it looks like this is done automatically.

If I wanted to put a $ in front of the value and I use:

function() { return '$' + Highcharts.numberFormat(this.value, 0) ; }

Then the label will now display $200,000,000.

How would i get the format to display it with the short form with the dollar sign like $200M ? thanks.

score 11 · Accepted Answer · answered Mar 05 '14 at 17:50

11

Unfortunately in this case, you have to either take the pre formatted label, or rebuild the level of abbreviation you want in the formatter yourself.

In this case, you could something like

 yAxis: {
        labels: {
            formatter: function() {
                return '$'+this.value / 1000000 + 'M';
            }
        }
    },

answered Mar 05 '14 at 17:50

jlbriggs

1

I was hoping that I wouldn't need to do that. Oh well. Thanks for your help. – Mike Stone Mar 05 '14 at 18:43

score 5 · Answer 2 · edited May 23 '17 at 12:33

5

According to this stackoverflow post, you can call the original formatter with:

this.axis.defaultLabelFormatter.call(this);

edited May 23 '17 at 12:33

Community

answered Apr 15 '16 at 00:38

stevenspiel

1

This is the correct answer. Although it should be called in a formatter function. – Rooster Oct 26 '18 at 17:16

score 0 · Answer 3 · answered Apr 03 '18 at 15:48

0

Put this code before call the chart

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

answered Apr 03 '18 at 15:48

jai3232

3 Answers3