我在Chart.js上有一个折线图,正在尝试编辑x轴和y轴上的间隔。
我的y轴间隔按预期运行,但x轴间隔不正常。
我尝试了以下代码
let myChart = new Chart(inputChart, {
type: 'line',
data: {
labels: [1,2,....,360] // list of values from python script
data: [360 random numbers here]
}
options: {
scales: {
yAxes: [{
id:'main-axis',
ticks: {
stepSize: 40 // this worked as expected
}
}],
xAxes: [{
id: 'main-x-axis',
ticks: {
stepSize: 30 // this did not work as expected
}
}]
}
}
})
对于360个数据点,我基本上只想看到12个间隔(以30为增量),但我看到的是以4为增量的90个间隔。我是否只是使用了错误的stepSize属性?如果是,正确的属性是什么?
2条答案
按热度按时间mkshixfv1#
它可以使用xAxes的
maxTicksLimit
选项来完成,请参阅此工作小提琴-〉http://jsfiddle.net/Lzo5g01n/3/vptzau2j2#
对于Chart.js 3.3.2,您可以使用@Kunal Khivensara的方法,但需要做一些修改。您可以查看文档。将
ticks
放在xAxis
中,将scales
放在xAxis
中。示例: