Format Highcharts Y-axis Labels
I'm using Highcharts to generate a line chart that shows currency values. By default the y-axis labels use metric prefixes for abbreviation, e.g. 3k is displayed instead of 3000 I
Solution 1:
You can call the original formatter from your formatter function:
$(function () {
$('#container').highcharts({
yAxis: {
labels: {
formatter: function () {
return'$' + this.axis.defaultLabelFormatter.call(this);
}
}
},
series: [{
data: [15000, 20000, 30000]
}]
});
});
Solution 2:
I looked in HighCharts source code and found out that if you pass a format
or formatter
it won't add numeric symbol. It is inside else if
statement i.e. formatOption xor numericSymbol. So you need to add a formatter and do the logic yourself.
this is a slightly modified copy-paste of their code:
formatter: function() {
var ret,
numericSymbols = ['k', 'M', 'G', 'T', 'P', 'E'],
i = numericSymbols.length;
if(this.value >=1000) {
while (i-- && ret === undefined) {
multi = Math.pow(1000, i + 1);
if (this.value >= multi && numericSymbols[i] !== null) {
ret = (this.value / multi) + numericSymbols[i];
}
}
}
return'$' + (ret ? ret : this.value);
}
Post a Comment for "Format Highcharts Y-axis Labels"