大家好，
如何控制 Chart.js 庫中的 Y 軸值？盡管每個圖表的代碼相同，但每個圖表中顯示的資料都不相同。
第一個圖表中的資料是這樣顯示的
而在第二張圖表中，資料是這樣的
我怎樣才能讓每個圖表的值都是 5，比如 5、10、20、25，因為我從來沒有浮點型的值。
代碼如下所示：
const ctx = document.getElementById('myChart').getContext('2d');
const myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: data.map(x => moment(x.date).format("MMM Do")),
datasets: [{
data: data.map(x => x.premium),
backgroundColor: '#ffec87',
borderColor: "#ffec87",
borderWidth: 2,
borderStyle: 'dotted'
}]
},
options: {
scales: {
xAxis: { grid: { display: false } },
yAxis: { grid: { borderDash: [3, 5] } }
}
}
});
非常感謝。
uj5u.com熱心網友回復：
在選項 scales 中，yAxis 添加步長
options: {
scales: {
xAxis: { grid: { display: false } },
yAxis: {
grid: { borderDash: [3, 5] },
ticks: {stepSize: 5}
}
}
}
uj5u.com熱心網友回復：
或者，您可以設定 y 軸刻度的最小值/最大值，如本例所示
https://www.chartjs.org/docs/latest/samples/scales/linear-min-max.html
scales: {
y: {
min: 0,
max: 25,
}
}
我剛剛在檔案中找到了討論 Amin 解決方案的地方，我想為了方便起見，我會在這里放一個參考。
https://www.chartjs.org/docs/latest/samples/scales/linear-step-size.html
y: {
title: {
display: true,
text: 'Value'
},
min: 0,
max: 100,
ticks: {
// forces step size to be 50 units
stepSize: 5
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/350017.html
標籤：javascript 图表.js
上一篇：檢查是否檢查了任何無線電輸入