Chartjs-Unable to change size of Chart.js

by

0👍

HTML canvas width and height attributes are element interpreted in CSS pixels but they need to be defined as integer values. Therefore you should remove ‘px‘ from your definitions.

<canvas id="chart" width="100" height="100"></canvas>

0👍

Here is an HTML code for two canvases of varying sizes. You just need to change the height and width attribute of the canvas tag.

I have added different colors to the two canvas for diffrentiation

var canvas1 = document.getElementById("first");
var ctx1 = canvas1.getContext("2d");
ctx1.fillStyle = "blue";
ctx1.fillRect(0, 0, canvas1.width, canvas1.height);

var canvas2 = document.getElementById("second");
var ctx2 = canvas2.getContext("2d");
ctx2.fillStyle = "red";
ctx2.fillRect(0, 0, canvas2.width, canvas2.height);
<canvas id="first" height="100"></canvas>
<canvas id="second" height="200"></canvas>

Leave a comment