HTML5 Canvas

What is HTML5 Canvas?

  • The <canvas> element is an easy and powerful way for drawing graphics using JavaScript.
  • It is used for drawing graphs, photo compositions or do simple animations.
<canvas id= “mycanvas” width =“100” height =“100”></canvas>

     it has two compulsory attributes width and height and,
     the core attributes like id, name and class etc, as per the requirement.

The <canvas> element in DOM can be found by using the getElementByID() method as follows:
var canvas = document.getElementById(“mycanvas”);

Example : Creating a Sample Canvas

          <canvas id="mycanvas" width="300" height="150" style="border:3px solid black"></canvas>


canvas 1