SVG 'ellipse' element

The SVG <ellipse> element draws an ellipse based on a center point and two radii. <ellipse> has the following attributes:

  • cx and cy attributes are coordinates for a center of an ellipse. The default value is '0'.
  • rx and ry attributes are respectively x- and y-axis radius of an ellipse. The negative value of the attribute is an error. If you set a value of zero it will disables rendering of a circle.

Here is a simple example:

<ellipse cx="80" cy="50" rx="60" ry="40" fill="lightblue" stroke="black"
stroke-width="2"/>

The resulting image is: