我正在使用http://www.chartjs.org/上的折线图
正如你可以看到Y轴的最大值(130)和最小值(60)是自动选择的,我想要最大值= 500和最小值=0。这可能吗?
我正在使用http://www.chartjs.org/上的折线图
正如你可以看到Y轴的最大值(130)和最小值(60)是自动选择的,我想要最大值= 500和最小值=0。这可能吗?
当前回答
这是针对Charts.js 2.0的:
其中一些不工作的原因是因为你应该在创建图表时像这样声明你的选项:
$(function () {
var ctxLine = document.getElementById("myLineChart");
var myLineChart = new Chart(ctxLine, {
type: 'line',
data: dataLine,
options: {
scales: {
yAxes: [{
ticks: {
min: 0,
beginAtZero: true
}
}]
}
}
});
})
相关文档如下: http://www.chartjs.org/docs/#scales
其他回答
你必须覆盖比例,试试这个:(适用于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
});
}
从最新版本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
}
}
}
在我的例子中,我在yaxis ticks中使用了一个回调, 我的值是百分比,当它达到100%时,它不显示点,我使用这个:
yAxes: [{
ticks: {
beginAtZero: true,
steps: 10,
stepValue: 5,
min: 0,
max: 100.1,
callback: function(value, index, values) {
if (value !== 100.1) {
return values[index]
}
}
}
}],
而且效果很好。
在1.1.1中,我使用以下方法来固定0.0和1.0之间的比例:
var options = {
scaleOverride: true,
scaleStartValue: 0,
scaleSteps: 10,
scaleStepWidth: 0.1
}
编辑:
他们做了一些改变。目前,这是可行的
scales: {
x: {
...,
max: value,
min: value
},
y: {
...same as x
}
}
这里是最新变化的链接 最小最大图表js
旧的回答:
截至2022年2月,这是有效的。以下是一个人可以改变它的方法
var options = {
scales: {
yAxes: [{
display: true,
stacked: true,
ticks: {
min: 0, // minimum value
max: 10 // maximum value
}
}]
}
};