9.1 Introduction

Mathematically, these shape elements are equivalent to a 'path' element that would
construct the same shape. The basic shapes may be stroked,
and filled. All of the properties available
for 'path' elements also apply to
the basic shapes.

9.2 The 'rect'
element

The 'rect' element defines
a rectangle which is axis-aligned with the current user coordinate
system. Rounded rectangles can be achieved by setting
appropriate values for attributes rx and ry.

The x-axis coordinate of the side of the rectangle
which has the smaller x-axis coordinate value in the
current user coordinate system.
If the attribute is not specified, the effect is as if a
value of "0" were specified.Animatable:
yes.

The y-axis coordinate of the side of the rectangle
which has the smaller y-axis coordinate value in the
current user coordinate system.
If the attribute is not specified, the effect is as if a
value of "0" were specified.Animatable:
yes.

The width of the rectangle.
A negative value is unsupported.
A value of zero disables rendering of the element. If the attribute is not specified, the effect is as if a
value of "0" were specified.Animatable:
yes.

The height of the rectangle.
A negative value is unsupported.
A value of zero disables rendering of the element. If the attribute is not specified, the effect is as if a
value of "0" were specified.Animatable:
yes.

For rounded rectangles, the x-axis radius of the
ellipse used to round off the corners of the
rectangle.
A negative value is unsupported.
See the notes below about what happens if the attribute is
not specified.Animatable:
yes.

For rounded rectangles, the y-axis radius of the
ellipse used to round off the corners of the
rectangle.
A negative value is unsupported.
See the notes below about what happens if the attribute is
not specified.Animatable:
yes.

If a properly specified value is provided for rx but not for ry, then the user agent must process
the 'rect' element with the
effective value for ry as equal to rx. If a properly specified value
is provided for ry but not for rx, then the user agent must process
the 'rect' element with the
effective value for rx as equal to ry. If neither rx nor ry has a properly specified value,
then the user agent must process the 'rect' element as if no
rounding had been specified, resulting in square corners. If rx is greater than half of the
width of the rectangle, then the user agent must process the 'rect' element with the
effective value for rx as half of the width of the
rectangle. If ry is greater than half of the
height of the rectangle, then the user agent must process the 'rect' element with the
effective value for ry as half of the height of the
rectangle.

Mathematically, a 'rect' element, taking its rounded
corners into account, must be drawn in a way that produces the
same output as the following rules:
(Note: all coordinate and length values are first converted
into user space coordinates according to Units.)

perform an absolute moveto operation
to location (x+rx,y), where x is
the value of the 'rect' element's x attribute converted to user
space, rx is the effective value of the rx attribute converted to user
space and y is the value of the y attribute converted to user
space

perform an absolute elliptical
arc operation to coordinate
(x+width,y+ry), where the effective values
for the rx and ry attributes on the 'rect' element converted to
user space are used as the rx and ry
attributes on the elliptical
arc command, respectively, the x-axis-rotation
is set to zero, the large-arc-flag is set to zero,
and the sweep-flag is set to one

perform a absolute vertical lineto to location
(x+width,y+height-ry), where
height is the 'rect' element's height attribute converted to
user space

Example 09_02 shows two
rounded rectangles. The rx specifies how to round the
corners of the rectangles. Note that since no value has been
specified for the ry attribute, it will be assigned
the same value as the rx attribute.

The radius of the circle.
A negative value is unsupported.
A value of zero disables rendering of the element. If the attribute is not specified, the effect is as if a
value of "0" were specified.Animatable:
yes.

The x-axis radius of the ellipse.
A negative value is unsupported.
A value of zero disables rendering of the element. If the attribute is not specified, the effect is as if a
value of "0" were specified.Animatable:
yes.

The y-axis radius of the ellipse.
A negative value is unsupported.
A value of zero disables rendering of the element. If the attribute is not specified, the effect is as if a
value of "0" were specified.Animatable:
yes.

Example 09_04 below
specifies the coordinates of the two ellipses in the user
coordinate system established by the viewBox attribute on the 'svg' element and the transform attribute on the 'g' and 'ellipse' elements. Both
ellipses use the default values of zero for the cx and cy attributes (the center of the
ellipse). The second ellipse is rotated.

The points that make up the polyline. All coordinate
values are in the user coordinate system.
An empty attribute value (points="") disables rendering of the element. If the attribute is not specified, the effect is as if an empty string (points="") was specified.
Animatable:
yes.

The points that make up the polygon. All coordinate
values are in the user coordinate system.
An empty attribute value (points="") disables rendering of the element. If the attribute is not specified, the effect is as if an empty string (points="") was specified.
Animatable:
yes.