javascript - 缩短 Charts.js 中的数字标签

Question

我正在使用 Chart.js 为客户制作一个简单的折线图，但显示的值都在数百万以上，使得标签在图表中占用了大量空间，如下所示：

例如，我想缩短标签以显示 M 而不是六个 0。

我查看了文档，但没有发现任何此类内容。

标签： javascriptchartschart.js

Answer 1

您可以覆盖ticks.callback此处记录的方法：https ://www.chartjs.org/docs/latest/axes/labelling.html#creating-custom-tick-formats

例如，将 y 轴零点简写为“M”：

var chart = new Chart(ctx, {
    type: 'line',
    data: data,
    options: {
        scales: {
            yAxes: [{
                ticks: {
                    // Abbreviate the millions
                    callback: function(value, index, values) {
                        return value / 1e6 + 'M';
                    }
                }
            }]
        }
    }
});

我的小提琴：https ://jsfiddle.net/robhirstio/hsvxbjkg/17/