How to draw a circle using SVG tag in HTML ?
In this article, you will learn about SVG basic shape like circle which is among the different shapes of SVG like <rect>, <line>, <ellipse>, <polygon>, etc. So you can easily draw circles using <circle> tag whose parent tag is SVG tag in HTML.
Basically, the <circle> element draws a circle on the screen which is done by the 3 basic parameters which include cx, cy, and r, which are briefly demonstrated further in this article.
<circle cx="x-axis co-ordinate" cy="y-axis co-ordinate" r="length" > </circle>
- cx: x-axis co-ordinate of the center of the circle. The default value is 0.
- cy: y-axis co-ordinate of the center of the circle. The default value is 0.
- r: Radius of the circle.
Note: cx and cy is the x-axis and y-axis co-ordinate which determines the position of the circle and r is the radius of the circle which determines the size of the circle. Circle rendering will be disabled if its radius is zero.