HTML5“画布高度和宽度”属性

Question

So far I have been assigning my canvas attributes as such:-

<canvas id="myCanvas" width="915" height="650" style="border: 2px double #000000;"></canvas>

However, now I have come across a scenario, where my canvas height is not static. It needs to be dynamic.

for example at times, I am drawing an XY graph on my canvas with 20 rows and other times 100 rows.

which means my y-axis labeling is dynamic and variable.

I don't know this at the beginning of my script where in my old method I am assigning my height.

So what I need is a counter that will, keep track of no of labels on the y-axis (say count` = 0, count ++)

Now, how do I dynamically update the height of the canvas from within my script ?

Can any one help?

Answer 1

You can increase the height of you canvas like this:

var c=document.getElementById("myCanvas");
c.height = whatEverHeightYouNeed;

If you change the height with CSS, your canvas drawings will be distorted.