LineChart axis manual max min
by bairog
HTML
<div id="chartDiv"><canvas id="chart"></canvas></div>
<script src="https://chartjs.org/dist/master/chart.js"></script>
JavaScript
var data = {
labels:["0","1","2"],
datasets: [{
lineTension: 0,
fill: false,
data: [0, 10, 4]
}]
};
const lineChartAxisMargin = 0.01;
var options = {
animation: false,
scales: {
yAxis: {
afterDataLimits: function (axis) {
//Setting axis min\max via `afterDataLimits` callback is working incorrectly (yAxis is from -2 to 12)
//console.log(axis);
//var axisLength = axis.max - axis.min;
//axis.options.max = Math.ceil(axis.max + axisLength * lineChartAxisMargin);
//axis.options.min = Math.floor(axis.min - axisLength * lineChartAxisMargin);
},
//position: 'bottom',
axis: 'y',
grace: '1%',
//Setting axis min\max via options is working correctly (yAxis is from -0.5 to 10.5)
//min: -0.5,
//max: 10.5
}
}
};
var ctx = document.getElementById("chart");
var myChart = new Chart(ctx, {
type: 'line',
data: data,
options: options
});