Chart.js yAxes Ticks stepSize not working (fiddle)(Chart.js yAxes Ticks stepSize 不起作用(小提琴))
问题描述
我已经为 yAxis 创建了一个带有这些选项的折线图:
yAxes: [{滴答声:{精度:1,步长:18.1,分钟:148.5,最大值:220.9}}]
因此,我希望 yAxis 可以这样缩放:
220.9202.8184.7166.6148.5
但是,当我提供此代码时,我正在获取此数据.
请看这个小提琴的例子:
另一种方法是使用 suggestedMin
和 suggestedMax
而不是 min
和 max
,这允许 Chart.js计算自己的min
和max
:
在你的情况下,你只需要申请:
yAxes: [{滴答声:{maxTicksLimit: 5,建议Min: 148.5,建议最大值:220.9,步长:18.1,},}]
I have created a line chart with these options for the yAxis:
yAxes: [{
ticks: {
precision: 1,
stepSize: 18.1,
min: 148.5,
max: 220.9
}
}]
I would like, therefore, the yAxis scales to be like this:
220.9
202.8
184.7
166.6
148.5
However, when I provide this code, I am getting this data.
Please see this fiddle for an example: https://jsfiddle.net/wxLzdrcm/
How can I make the yAxis ticks add up like I have described?
This question was asked at least twice (1, 2).
The solution is to use min
and max
values so that stepSize
is a factor of max - min
, allowing the chart to actually use the specified stepSize
:
yAxes: [{
ticks: {
maxTicksLimit: 5,
min: 144.8, // 18.1 * 8
max: 235.3, // 18.1 * 13
stepSize: 18.1,
},
}]
An alternative would be using suggestedMin
and suggestedMax
rather than min
and max
, which allows Chart.js to calculate its own min
and max
:
In your case, you just need to apply:
yAxes: [{
ticks: {
maxTicksLimit: 5,
suggestedMin: 148.5,
suggestedMax: 220.9,
stepSize: 18.1,
},
}]
这篇关于Chart.js yAxes Ticks stepSize 不起作用(小提琴)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:Chart.js yAxes Ticks stepSize 不起作用(小提琴)
基础教程推荐
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01
- Chart.js 在线性图表上拖动点 2022-01-01
- 直接将值设置为滑块 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01
- 自定义 XMLHttpRequest.prototype.open 2022-01-01