Html5 canvas draw circle Tag

The canvas draw circle tag is used to draw circle graphics on the web page.

Example Code

<!DOCTYPE HTML>
<canvas id="draw_circle" width="200" height="100">
  Your browser does not support the canvas element.
</canvas>
<script type="text/javascript">
   var c=document.getElementById("draw_circle");
   var cxt=c.getContext("2d");
   cxt.fillStyle="#C968F2";
   cxt.beginPath();
   cxt.arc(150,50,35,0,Math.PI*2,true);
   cxt.closePath();
   cxt.fill();
</script>

Out Put :

In the above example code arc() function is used to draw circle. The first parameter 150 is start point for left to right and 50 is start point for top to center and 35 is a startAngle and 0 is a endAngle for a circle.

Canvas Tag Attribute

Content