How to change the canvas size in html?

by edmond_brakus , in category: Javascript , 4 months ago

How to change the canvas size in html?

Facebook Twitter LinkedIn Telegram Whatsapp

1 answer

Member

by aubrey , 4 months ago

@edmond_brakus 

To change the canvas size in HTML, you can use the width and height attributes of the <canvas> element.


Here is an example code snippet:

1
<canvas id="myCanvas" width="800" height="600"></canvas>


In this code, the canvas element with the id "myCanvas" has a width of 800 pixels and a height of 600 pixels.


You can also set the canvas size dynamically using JavaScript by accessing the canvas element and setting the width and height properties.


Here is an example code snippet using JavaScript:

1
2
3
4
5
6
7
<canvas id="myCanvas"></canvas>

<script>
  var canvas = document.getElementById("myCanvas");
  canvas.width = 800;
  canvas.height = 600;
</script>


In this code, the canvas element with the id "myCanvas" is accessed using document.getElementById and then the width and height properties are set to 800 and 600 respectively.