Adding Suffix in Axis Labels - CanvasJS JavaScript Charts

Adding Suffix in Axis Labels - CanvasJS JavaScript Charts

by canvasjs

HTML

<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<br/><!-- Just so that JSFiddle's Result label doesn't overlap the Chart -->
<div id="chartContainer" style="height: 360px; width: 100%;"></div>

JavaScript

var chart = new CanvasJS.Chart("chartContainer", {
    title: {
      	text: "Adding Suffix in axisY Labels"
    },
    axisY: {
      	labelFormatter: addSymbols
    },
    data: [{
        type: "spline",
        dataPoints: [
            { x: 10, y: 710000 },
            { x: 20, y: 550000 },
            { x: 30, y: 500000 },
            { x: 40, y: 650000 },
            { x: 50, y: 950000 },
            { x: 60, y: 680000 },
            { x: 70, y: 1280000 },
            { x: 80, y: 340000 },
            { x: 90, y: 1400000 }
        ]
    }]
});

chart.render();

function addSymbols(e){
    var suffixes = ["", "K", "M", "B"];

    var order = Math.max(Math.floor(Math.log(e.value) / Math.log(1000)), 0);
    if(order > suffixes.length - 1)
      	order = suffixes.length - 1;

    var suffix = suffixes[order];
    return CanvasJS.formatNumber(e.value / Math.pow(1000, order)) + suffix;
}