我正在使用http://www.chartjs.org/上的折线图
正如你可以看到Y轴的最大值(130)和最小值(60)是自动选择的,我想要最大值= 500和最小值=0。这可能吗?
我正在使用http://www.chartjs.org/上的折线图
正如你可以看到Y轴的最大值(130)和最小值(60)是自动选择的,我想要最大值= 500和最小值=0。这可能吗?
当前回答
关于这个问题,有很多相互矛盾的答案,其中大多数对我没有任何影响。
我终于能够用chart.options.scales.xAxes[0].ticks设置(或检索当前)x轴最小和最大显示值。最小值(即使最小值和最大值只是分配给图表的数据的子集)。
在我的例子中使用时间刻度,我使用:
chart.options.scales.xAxes[0].ticks.min = 1590969600000; //Jun 1, 2020
chart.options.scales.xAxes[0].ticks.max = 1593561600000; //Jul 1, 2020
chart.update();
(我发现不需要设置步长值或beginAtZero等)
其他回答
你必须覆盖比例,试试这个:(适用于ChartJS v1.x)
window.onload = function(){
var ctx = document.getElementById("canvas").getContext("2d");
window.myLine = new Chart(ctx).Line(lineChartData, {
scaleOverride : true,
scaleSteps : 10,
scaleStepWidth : 50,
scaleStartValue : 0
});
}
对于Chart.js v3.2.0,这样做:
let options = {
scales: {
y: {
suggestedMin: 0,
suggestedMax: 69
},
x: {
suggestedMin: 0,
suggestedMax: 420
}
}
}
文档:https://www.chartjs.org/docs/latest/axes/ axis-range-settings
只需在选项中设置scaleStartValue的值。
var options = {
// ....
scaleStartValue: 0,
}
请在这里查看相关文档。
从最新版本v3.9.1开始,你可以像这样设置你的比例:
options:{
scales:{
y:{
beginAtZero: true,
max: 500 // values over 500 will be hidden, OR
suggestedMax: 500, // maximum will be 500, unless there is a higher value
}
}
}
由于上面的建议对我的charts.js 2.1.4没有任何帮助,我通过将值0添加到我的数据集数组(但没有额外的标签)来解决它:
statsData.push(0);
[...]
var myChart = new Chart(ctx, {
type: 'horizontalBar',
data: {
datasets: [{
data: statsData,
[...]