Monday, 01 July 2019 08:24

What is html canvas and how to use it

Written by 
Rate this item
(0 votes)

The HTML5 <canvas> element draws graphics via JavaScript.


 So the <canvas> element is only a container for graphics,  


JavaScript must be used to draw the graphics actually.

Canvas has many methods for drawing boxes, circles, text, paths, adding images.

Canvas markup is defined as follows - 

<canvas id="testCanvas" width="200" height="100"></canvas>

Now using javascript following scripts show how to draw a circle - 

var c = document.getElementById("testCanvas");

var cx = c.getContext("2d");


cx.arc(95, 50, 40, 0, 2 * Math.PI);


Hope it was useful information, don't forget to share and like it.

Read 1426 times
Super User

Email This email address is being protected from spambots. You need JavaScript enabled to view it.

Latest discussions

  • No posts to display.