在图表js中设置最小步长

Question

我使用Chart.js 2.0版本绘制图形,我想在条形图中定义最小步长

var myNewChart = new Chart(grapharea, {
                type: 'bar',
                data: barData,
                options: {
                    responsive: true,                        
                    scales: {
                        yAxes: [
                            {
                                ticks: {
                                    min: 0, // it is for ignoring negative step.
                                    beginAtZero: true,
                                    stepSize: 1  // if i use this it always set it '1', which look very awkward if it have high value  e.g. '100'.
                                }
                            }
                        ]
                    }
                }
            });

这次我正在使用

stepSize:1

我使用这个步长来忽略点值,例如'0.5',它表示当最大图值id较小时,例如'2'.
如果我使用它,它总是将步骤设置为'1',如果它具有高值,例如'100',则看起来很尴尬.

我在寻找这样的东西:suggestMin = 1

是否有任何东西来定义最小步长,在较高值的情况下不应该修复.

Answer 1

如果您不想显示点值(例如0.5)标签,则可以编写回调函数来过滤点值标签,而不是使用stepSize.

像这样:

ticks: {
    min: 0, // it is for ignoring negative step.
    beginAtZero: true,
    callback: function(value, index, values) {
        if (Math.floor(value) === value) {
            return value;
        }
    }
}

在这里工作小提琴:https://jsfiddle.net/ma7h611L/

Answer 2

ticks: {
    precision: 0
}

这与上面的回调函数同样有效，并且更加简洁。

精度（如果已定义且未指定stepSize），则步长将舍入到许多小数位。

https://www.chartjs.org/docs/latest/axes/cartesian/linear.html