ChartJS y轴刻度配置求助:如何设置0-100、步长25的y轴?
解决ChartJS Y轴刻度配置(0-100,步长25)的问题
嘿,太懂你找靠谱资料的痛苦了——ChartJS版本更新快,旧文档很容易误导人!你现在用的steps和stepValue属性早就被废弃了,这就是为啥你的配置达不到预期效果。
正确配置方式(ChartJS v2版本适用)
直接用ticks里的min、max和stepSize这三个属性就能搞定,替换掉你原来的过时参数:
yAxes: [ { ticks: { min: 0, // 设定Y轴最小值为0 max: 100, // 设定Y轴最大值为100 stepSize: 25, // 设定刻度步长为25 beginAtZero: true // 其实可以不用,因为已经指定了min:0,不过保留也不影响 } } ]
如果是ChartJS v3及以上版本
注意v3之后配置结构做了扁平化调整,不再有yAxes数组,直接在scales下配置y轴:
scales: { y: { min: 0, max: 100, ticks: { stepSize: 25 } } }
这样设置后,Y轴就会精准显示0、25、50、75、100这几个刻度,完全符合你的需求啦!
内容的提问来源于stack exchange,提问作者SNYDERHAUS




