给出过去9天的日期标签和数字数据集(2.5、1.5等),我希望y轴上的数字/标签为1-5的整数,同时保持分数。我想说的是,我想在网格中有固定数量的行,而我对如何做到这一点一无所知。谁能帮我吗?
当前图:
期望图:
最短的方法:
yAxes: [{
stacked: true,
}]
https://www.chartjs.org/docs/latest/charts/bar.html#stacked-bar-chart
/* data */
var data = {
labels: ["Africa", "Asia", "Europe", "America"],
datasets: [{
/* data */
label: "Data label",
backgroundColor: ["#3e95cd", "#8e5ea2","#3cba9f", '#1d49b8'],
data: [5.6,6.7,7.5, 8.6]
}]
};
var options = {
responsive: true,
title: {
text: 'Hello',
display: true
},
scales: {
xAxes: [{
stacked: false,
ticks: {
},
}],
yAxes: [{
stacked: true,
}]
}
};
var myChart = new Chart(document.getElementById("chart"), {
type: 'bar',
data: data,
options: options
});
<canvas id="chart"></canvas>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>
https://www.chartjs.org/docs/latest/axes/cartesian/linear.html#step-size
更多控制==>设置步长(在您的示例中为1
:]]
yAxes: [{
stacked: true,
ticks: {
stepSize: 1
}
}]
/* data */ var data = { labels: ["Africa", "Asia", "Europe", "America"], datasets: [{ /* data */ label: "Data label", backgroundColor: ["#3e95cd", "#8e5ea2","#3cba9f", '#1d49b8'], data: [5.0,6.7,7.5, 8.6] }] }; var options = { responsive: true, title: { text: 'Hello', display: true }, scales: { xAxes: [{ stacked: false, ticks: { }, }], yAxes: [{ stacked: false, ticks: { stepSize: 1 } }] } }; var myChart = new Chart(document.getElementById("chart"), { type: 'bar', data: data, options: options });
<canvas id="chart"></canvas> <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>