Change grid height

I have a problem with the html5 canvas. I have a dataset to fill the schedule in the canvas according to the data from the database. How to set the height of the grid more than one division. It should look something like this:

My version:

I need to make the grid as sdes, where the top point is 50C, but there are distances to the graphs themselves from above. How do I make the same offset? Since my extreme point is the maximum value from the base, i.e. My schedule would not begin with 50C, but with 40C. And the top point is raised upwards, which does not look good. I hope my explanation is not very extensive.

Code:

$('#graf_' + i + '').html('<canvas id="lineChart' + i + '" width="' + $(".graf").width() + '" height="200"></canvas>'); var lineData = { labels: data["headers"], datasets: [ { label: data["rates"][i]["VltName"], fillColor: "transparent", strokeColor: data["rates"][i]["VltColor"], pointColor: data["rates"][i]["VltColor"], pointStrokeColor: "#fff", pointHighlightFill: "#fff", pointHighlightStroke: "rgba(220,220,220,1)", data: getRatesArr } ] }; var lineOptions = { scaleShowGridLines: true, scaleGridLineColor: "rgba(0,0,0,.05)", scaleGridLineWidth: 1, bezierCurve: false, pointDot: true, pointDotRadius: 4, pointDotStrokeWidth: 1, pointHitDetectionRadius: 20, datasetStroke: true, datasetStrokeWidth: 2, datasetFill: true }; var ctx = document.getElementById("lineChart" + i).getContext("2d"); var myNewChart = new Chart(ctx).Line(lineData, lineOptions);