Chart: Format y axis labels to show k, M, B for currency values
Application Type
Traditional Web

Hi

I'm using a chart to display currency values. The data series sometimes shows 1,000s, 1,000,000's  and I need the Y-axis to display a shortened label such as 10k, 25k or 1.3M.

I know I have to set the high chart options but can't figure where I need to put this statement. Adding it to teh HighchartsJSON on the AdvancedFormat_Init does nothing.

Highcharts.setOptions({lang: {numericSymbols: [ ' k', ' M', ' B', ' T']}});

Anyone help?

Thanks


this is for 1000 = k, add more logic/if for ' M', ' B', ' T 

yAxis:{

      labels: {

        formatter: function() {

          if ( this.value > 1000 ) return Highcharts.numberFormat( this.value/1000, 1) + "k";  //  only switch if > 1000

          return Highcharts.numberFormat(this.value,0);

        }               

      }

  }

Hi Mohsin

Thanks for your reply, it's very helpful. I have implemented something similar to your suggestion already however as it formats each value individually I sometimes get a mix of 'k' and 'M'. For example if the range of for y-axis goes from zero to 1.25 M, the axis displays 250k, 500k, 750k, 1M and 1.25M. My client doesn't like this and would prefer it in M, so 0.25M, 0.5M etc...

From the Highcharts doc I found a ref to global setting which I think will do the trick. However I just can't figure out where to put this in my OS widgets.

Highcharts.setOptions({lang: {numericSymbols: [ ' k', ' M', ' B', ' T']}});

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.