如何在Chart.js上更改X轴间隔
我在Chart.js上有一个折线图,正在尝试编辑x轴和y轴上的间隔 我的y轴间隔正常工作,但我的x轴间隔不正常 我尝试了以下代码如何在Chart.js上更改X轴间隔,chart.js,chartjs-2.6.0,Chart.js,Chartjs 2.6.0,我在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]
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个间隔。我只是使用了错误的步长属性吗?如果是,正确的属性是什么?可以使用xAxes的
maxTicksLimit
选项完成,请参阅此工作小提琴->
xAxis值不会自动计算,无论我们在
标签中提供的值是多少,都会在那里绘制。只需提供您希望在xAxis中看到的值,没有步长选项。我尝试过这样做,当我提供12个标签时,我只得到12个数据点,而丢失了其他348个数据点。难道没有更好的方法来处理这个问题吗?
xAxes: [{
type: 'time',
ticks: {
autoSkip: true,
maxTicksLimit: 20
}
}]