Chart.js - Formatting Y axis

I'm using Chart.js to draw a simple bar plot and I need to format its Y axis like

123456.05 to 123 456,05 $

I don't understand how to use scaleLabel : "<%=value%>"

I saw someone pointing to "JS Micro-Templating",
but no clue how to use that with our scaleLabel option.

Does someone know how to format this Y axis, and maybe give me an example ?


Solution 1:

I had the same problem, I think in Chart.js 2.x.x the approach is slightly different like below.

ticks: {
    callback: function(label, index, labels) {
        return label/1000+'k';
    }
}

More in details

var options = {
    scales: {
        yAxes: [
            {
                ticks: {
                    callback: function(label, index, labels) {
                        return label/1000+'k';
                    }
                },
                scaleLabel: {
                    display: true,
                    labelString: '1k = 1000'
                }
            }
        ]
    }
}

Solution 2:

An undocumented feature of the ChartJS library is that if you pass in a function instead of a string, it will use your function to render the y-axis's scaleLabel.

So while, "<%= Number(value).toFixed(2).replace('.',',') + ' $' %>" works, you could also do:

scaleLabel: function (valuePayload) {
    return Number(valuePayload.value).toFixed(2).replace('.',',') + '$';
}

If you're doing anything remotely complicated, I'd recommend doing this instead.