SVG ellipse Element
 Complete SVG Reference
Definition and Usage
The SVG ellipse element is used to create an ellipse.
An ellipse is closely related to a circle. The difference is that an ellipse
has an x and a y radius that differs from each other, while a circle has equal x
and y radius.
The cx and cy attributes define the x and y coordinates of the center of the
ellipse. If cx and cy are omitted, the ellipse's center is set to (0, 0).
The rx attribute defines the horizontal radius and the ry attribute defines
the vertical radius of the ellipse.
Example 1
This example creates an ellipse.
Copy the following code into Notepad and save
the file as "ellipse_1.svg". Place the file in your Web directory:
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" version="1.1"
xmlns="http://www.w3.org/2000/svg">
<ellipse cx="300" cy="150" rx="200" ry="80"
style="fill:rgb(200,100,50);
stroke:rgb(0,0,100);stroke-width:2"/>
</svg>
|
View example
Complete SVG Reference
| 
HOME
Printer friendly page
