javascript – ChartJS beginAtZero, min, max doesnt work
javascript – ChartJS beginAtZero, min, max doesnt work
key is to pass options in the Chart constructor instead of part of data
new Chart(ctx, {
type: bar,
data: {{ chart_data|safe }},
options: {
scales: {
yAxes: [{
display: true,
ticks: {
beginAtZero: true
}
}]
}
}
});
above works for me!
@Nikolas,
Here is the fiddle where the parameters you set works well.
https://jsfiddle.net/shemdani/zkb215up/2/
var options = {
responsive: true,
scales: {
yAxes: [{
display: true,
ticks: {
beginAtZero: true,
max: 100,
min: 0
}
}]
},
title: {
display: true,
text: name
},
tooltips: {
mode: index,
intersect: false,
},
hover: {
mode: nearest,
intersect: true
},
};
var data = {
labels: [Red, Blue, Yellow, Green, Purple, Orange],
datasets: [{
label: # of Votes,
data: [32, 59, 36, 25, 68, 71],
backgroundColor: [
rgba(255, 99, 132, 0.2),
rgba(54, 162, 235, 0.2),
rgba(255, 206, 86, 0.2),
rgba(75, 192, 192, 0.2),
rgba(153, 102, 255, 0.2),
rgba(255, 159, 64, 0.2)
],
borderColor: [
rgba(255,99,132,1),
rgba(54, 162, 235, 1),
rgba(255, 206, 86, 1),
rgba(75, 192, 192, 1),
rgba(153, 102, 255, 1),
rgba(255, 159, 64, 1)
],
borderWidth: 1
}]
}
var ctx = document.getElementById(myChart);
var chartInstance = new Chart(ctx, {
type: line,
data: data,
options:options
});
Please check and see what you are doing wrong. I used the basic data from charjs documentation.
javascript – ChartJS beginAtZero, min, max doesnt work
Working for version 3.2.0:
var options = {
// plugins, responsive etc...
scales: {
y: {
min: 0
}
},
//tooltips specifications...
}
The y-axis will start at 0: