Canvas Tutorials

Canvas Methods and Properties

Drawing in Canvas




All drawing on the HTML canvas must be done with JavaScript.


Steps to draw on Canvas are:-


1. Find the Canvas Element and refer it to JavaScript:-


The first step is to find the < canvas > element and for this purpose, we can use getElementById().


2. Create a Drawing Object:-


The second step is to create an object with which we can draw. For this purpose, we can use HTML built-in method getContext().


3. Draw on the Canvas:-


The last step is to draw on canvas. For this purpose, the getContext() method has many properties and methods for drawing purposes.


Some of these properties and methods are:-


  • moveTo()
  • lineTo()
  • stroke()
  • fillStyle()
  • fillRect()

Code Explanation

All Tutorials related to Canvas Tutorials

All Sections related to Canvas