Chart.js stepSize无法与分钟一起使用 [英] Chart.js stepSize not working with min
问题描述
min.
包括小提琴- https://jsfiddle.net/4p93aew7/10/
var options = {
type: 'line',
data: {
labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
datasets: [{
label: '# of Votes',
data: [12, 19, 23, 15, 32, 33],
borderWidth: 1
},
{
label: '# of Points',
data: [17, 11, 25, 18, 13, 37],
borderWidth: 1
}
]
},
options: {
scales: {
yAxes: [{
ticks: {
min: 5,
max: 40,
stepSize: 8
}
}]
}
}
}
var ctx = document.getElementById('chartJSContainer').getContext('2d');
new Chart(ctx, options);
canvas {
background-color: #eee;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.bundle.min.js"></script>
<body>
<canvas id="chartJSContainer" width="600" height="400"></canvas>
</body>
在示例中,步长为8,最小值为5,因此每个步长应为8 (从5开始),但显然不是.我该如何解决?
In the example, step size is 8 and min is 5, so each step should be 8 starting from 5 but it clearly isn't. How do I fix this?
编辑:适用于那些希望关注此问题的人.这是一个 github 链接
Edit: For those who wants to follow this issue. Here is a github link
推荐答案
您要强制使用 min
, max
和 stepSize
不能一起工作.自动缩放算法正在尽最大努力实现您的要求,但是必须付出一些努力.
You're forcing a min
, a max
, and a stepSize
that don't work together. The auto-scaling algorithm is doing its best achieve what you ask, but something has to give.
如果您真的希望它可以正常工作,则需要确保范围( max
- min
)可以被 stepSize
整除.例如:
If you really want it work cleanly you need to ensure the range (max
-min
) is cleanly divisible by the stepSize
. E.g.:
40-5 = 35
35/7 = 5
5是一个整数,所以可以使用刻度.
5 is a whole number, so the scale will work.
35/8 = 4.375
4.375不是整数,因此刻度不起作用.
4.375 isn't a whole number so the scale won't work.
如果您将 max
设为45,那么
If you make max
45 then
45-5 = 40
40/8 = 5
同样,5是一个整数,小数位数将起作用.
Again, 5 is a whole number and the scale will work.
这篇关于Chart.js stepSize无法与分钟一起使用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!