Question

How can i create a Circle in Html using javascript. Does it can be done using Javascript or not? I have done creating rectangles and squares but don’t know how to accomplish a circle.

Answer 1

You need to use the following liabrary:-

Put the code in your head tag.

<script type="text/JavaScript" src="jsDraw2D.js"></script>

It is available to download from here

Copy and paste the following code where you want your circle to appear…

<script type="text/JavaScript">

//Create jsGraphics object
var gr = new jsGraphics(document.getElementById("canvas"));

//Create jsColor object
var col = new jsColor("red");

//Create jsPen object
var pen = new jsPen(col,1);

//Draw a Line between 2 points
var pt1 = new jsPoint(20,30);
var pt2 = new jsPoint(120,230);
gr.drawLine(pen,pt1,pt2);

//Draw filled circle with pt1 as center point and radius 30. 
gr.fillCircle(col,pt1,30);

//You can also code with inline object instantiation like below
gr.drawLine(pen,new jsPoint(40,10),new jsPoint(70,150)); 

</script>

You can check the documentation for this from here