4.1. Definitions
- initial value
-
The initial value of an attribute or property is the value used when that attribute or property is not specified, or when it has an invalid value. This value is to be used for the purposes of rendering, calculating animation values, and when accessing the attribute or property via DOM interfaces.
- invalid value
- An invalid value specified for a property, either in a style sheet or a presentation attribute, is one that is either not allowed according to the grammar defining the property’s values, or is allowed by the grammar but subsequently disallowed in prose. A CSS declaration with an invalid value is ignored.
4.2. Attribute syntax
In this specification, attributes are defined with an attribute definition table, which looks like this:
| Name | Value | Initial value | Animatable |
|---|---|---|---|
| exampleattr | <length> | none | none | yes |
In the Value column is a description of the attribute’s syntax. There are six methods for describing an attribute’s syntax:
- Using the CSS Value Definition Syntax [css-values]. This is the notation used to define the syntax for most attributes in this specification and is the default.
- By reference to an EBNF symbol defined in this or another specification [xml]. For external definitions, this is indicated by [EBNF] appearing in the Value column.
- By reference to an ABNF symbol defined in another specification [rfc5234]. This is indicated by [ABNF] appearing in the Value column.
- As a URL as defined by the URL Standard [URL]. This is indicated by [URL] appearing in the Value column.
- As a type as defined by the HTML Standard [HTML]. This is indicated by [HTML] appearing in the Value column.
- In prose, below the attribute definition table. This is indicated by the text "(see below)" appearing in the Value column.
| SVG 2 Requirement: | Consider relaxing case sensitivity of presentation attribute values. |
|---|---|
| Resolution: | We will make property values case insensitivity. |
| Purpose: | To align presentation attribute syntax parsing with parsing of the corresponding CSS property. |
| Owner: | Cameron (ACTION-3276) |
| Status: | Done |
When a presentation attribute defined using the CSS Value Definition Syntax is parsed, this is done as follows:
- Let value be the value of the attribute.
- Let grammar be the grammar given in the attribute definition table’s Value column.
- Replace all instances of <length> in grammar with [<length> | <number>].
- Replace all instances of <length-percentage> in grammar with [<length-percentage> | <number>].
- Replace all instances of <angle> in grammar with [<angle> | <number>].
- Return the result of parsing value with grammar.
The insertion of the <number> symbols allows for unitless length and angles to be used in presentation attribute while disallowing them in corresponding property values.
Note that all presentation attributes, since they are defined by reference to their corresponding CSS properties, are defined using the CSS Value Definition Syntax.
When any other attribute defined using the CSS Value Definition Syntax is parsed, this is done by parsing the attribute’s value according to the grammar given in attribute definition table.
Note that this allows CSS comments and escapes to be used
in such attributes. For example, a value of '10\px/**/'
would successfully parse as '10px' in
the ‘x’ presentation attribute of the ‘rect’ element.
When an attribute defined as a URL is parsed, this is done by invoking the URL parser with the attribute’s value as input and the document’s URL as base [URL].
The Initial value column gives the initial value for the attribute. When an attribute fails to parse according to the specified CSS Value Definition Syntax, ABNF or EBNF grammar, or if parsing according to the URL Standard or by the prose describing how to parse the attribute indicates failure, the attribute is assumed to have been specified as the given initial value.
The initial value of a presentation attribute is its corresponding property’s initial value. Since the use of an invalid value in a presentation attribute will be treated as if the initial value was specified, this value can override values that come from lower priority style sheet rules, such as those from the user agent style sheet.
For example, although the user agent style sheet sets the value of the
overflow property to hidden
for ‘svg’ elements, specifying an invalid presentation attribute such
as overflow="invalid" will result
in a rule setting overflow to visible,
overriding the user agent style sheet value.
The Animatable column indicates whether the attribute can be animated using animation elements as defined in the SVG Animation module.
4.2.1. Real number precision
Unless stated otherwise, numeric values in SVG attributes and in properties that are defined to have an effect on SVG elements must support at least all finite single-precision values supported by the host architecture.
It is recommended that higher precision floating point storage and computation be performed on operations such as coordinate system transformations to provide the best possible precision and to prevent round-off errors.
conforming SVG viewers are required to perform numerical computation in accordance with their conformance class, as described in Conformance Criteria.
4.2.2. Clamping values which are restricted to a particular range
Some numeric attribute and property values have restricted ranges. Other values will be restricted by the capabilities of the device. If not otherwise specified, the user agent shall defer any out-of-range error checking until as late as possible in the rendering process. This is particularly important for device limitations, as compound operations might produce intermediate values which are out-of-range but final values which are within range.
4.3. SVG DOM overview
Conforming SVG viewers or SVG interpreters that support script execution must implement SVG DOM interfaces as defined throughout this specification, with the specific requirements and dependencies listed in this section.
| SVG 2 Requirement: | Improve the DOM. |
|---|---|
| Resolution: | We will generally improve the SVG DOM for SVG 2. |
| Purpose: | Help authors use the SVG DOM by making it less Java-oriented. |
| Owner: | Cameron (ACTION-3273) |
| Note: | See SVG 2 DOM Wiki page. |
| SVG 2 Requirement: | Improve the SVG path DOM APIs. |
|---|---|
| Resolution: | We will improve the SVG path DOM APIs in SVG 2. |
| Purpose: | Clean up SVGPathSegList interface, and possibly share an API with Canvas. |
| Owner: | Cameron (no action) |
4.3.1. Dependencies for SVG DOM support
The SVG DOM is defined in terms of Web IDL interfaces. All IDL fragments in this specification must be interpreted as required for conforming IDL fragments, as described in the Web IDL specification. [WebIDL]
The SVG DOM builds upon a number of DOM specifications. In particular:
- The SVG DOM requires full support for the DOM, as defined by the most recent Review Draft of the DOM living standard at the time this specification was published, except for any features that have been removed or deprecated since. SVG software with DOM support should implement the latest DOM standard wherever possible [DOM]
- The SVG DOM requires support for relevant aspects of UI Events and Clipboard API and events ([uievents], [clipboard-apis]). (For the specific features that are required, see Relationship with UI Events.)
- The SVG DOM requires, at a minimum, complete support for all interfaces from DOM Level 2 Style ([dom-level-2-style]) that have not been dropped in the CSS Object Model (CSSOM) specification. SVG software should implement the latest version of CSS Object Model (CSSOM) wherever possible ([cssom-1])
- The SVG DOM requires complete support for Geometry Interfaces Module Level 1 ([geometry-1]).
4.3.2. Naming conventions
The SVG DOM follows similar naming conventions to HTML and DOM standards ([HTML], [DOM]).
All names are defined as one or more English words concatenated together to form a single string. Property or method names start with the initial keyword in lowercase, and each subsequent word starts with a capital letter. For example, a property that returns document meta information such as the date the file was created might be named "fileDateCreated".
Interface names defined in this specification nearly all start with "SVG".
Interfaces that represent the DOM Element object
for an SVG-namespaced element follow the format
SVGElementNameElement, where ElementName
is the element’s tag name with the initial letter capitalized.
So SVGRadialGradientElement is the interface for an ‘radialGradient’ element.
An exception to this casing convention is SVGSVGElement,
in which the entire tag name is capitalized.
4.3.3. Elements in the SVG DOM
Any SVG software that is required to support the SVG DOM must enhance the DOM elements created for SVG document fragments as follows:
-
Every Element object that corresponds to a supported SVG element (that is, an element with namespace URI "http://www.w3.org/2000/svg" and a local name that is one of the elements defined in this specification or another specification implemented by the software) must also implement the DOM interface identified in the element definition.
-
Elements in the SVG namespace whose local name does not match an element defined in any specification supported by the software must nonetheless implement the
SVGElementinterface.
In The ‘rect’ element,
the SVGRectElement interface is identified. This means that every
Element object whose namespace URI is "http://www.w3.org/2000/svg"
and whose local name is "rect" must also implement SVGRectElement.
4.3.4. Reflecting content attributes in the DOM
Many SVG DOM properties (IDL attributes)
reflect a content attribute or property
on the corresponding element,
meaning that content and IDL attributes represent the same underlying data.
For example,
the SVGAnimatedLength ry in an
SVGRectElement
reflects the ry presentation attribute on the associated ‘rect’ element.
The way this reflection is done depends on the type of the IDL attribute:
- If the type of the reflecting IDL attribute is a
primitive type (such as
long, as used by tabIndex
on
SVGElement) or DOMString (as used by title onSVGStyleElement), then the rules for reflecting content attributes in IDL attributes in HTML are used. -
If the type of the reflecting IDL attribute is an
SVGAnimatedBoolean,SVGAnimatedString,SVGAnimatedEnumeration,SVGAnimatedNumber,SVGAnimatedNumberList,SVGAnimatedLength,SVGAnimatedLengthList,SVGAnimatedAngle,SVGAnimatedRectorSVGAnimatedPreserveAspectRatio, then the rules in the corresponding section defining the reflecting interface are used.At a high level, the object’s
baseValis used to reflect the value of the content attribute. For objects that reflect a CSS property, thebaseValis used to reflect the presentation attribute.
This relationship is live, and values must be synchronized (following the rules in Synchronizing reflected values) when either the attribute or its reflected property is modified.
If the attribute hasn’t been specified explicitly in the document markup, the reflected object is nonetheless initialized upon access, to the attribute’s initial value. If the attribute’s initial value is (none), the object is initialized as defined in Reflecting an empty initial value. This newly constructed object does not generate an attribute on the element until it is modified for the first time. Modifications made to the corresponding attribute are immediately reflected in the object.
If lineElement.x1.baseVal is accessed
(where lineElement is an instance of SVGLineElement)
and the ‘x1’ attribute was not specified in the document, the
returned SVGLength object would represent the value 0 user units,
because the initial value for the attribute is 0.
4.3.5. Synchronizing reflected values
Whenever a reflected content attribute’s base value changes, then the reflecting object must be synchronized, immediately after the value changed, by running the following steps:
- If the reflecting object is a list interface object, then run the steps for synchronizing a list interface object.
-
Otherwise, update the object’s value to be the base value of the reflected
content attribute (using the attribute’s initial value if it is not
present or invalid).
This will, for example, update the value of an
SVGLengthobject.
When a reflected content attribute is to be reserialized, optionally using a specific value, the following steps must be performed:
- Let value be the specific value given, or the value of the content attribute’s reflecting IDL attribute if a specific value was not provided.
-
Depending on value’s type:
SVGAnimatedBooleanSVGAnimatedNumberSVGAnimatedLengthSVGAnimatedAngleSVGAnimatedRectSVGAnimatedStringSVGAnimatedNumberListSVGAnimatedLengthListSVGAnimatedTransformList- Reserialize the content attribute using value’s baseVal member.
SVGAnimatedEnumeration-
- Let number be the value of value’s baseVal member.
-
Let keyword be the content attribute’s keyword
value corresponding to number, or the empty string
if number is 0.
This means that if the enumeration value is somehow set to the "unknown" value, the content attribute will be set to the empty string. However, this unknown value can never be set directly on the
SVGAnimatedEnumerationobject; it represents an unknown attribute value set in the markup. - Set the content attribute to keyword.
- boolean
- Set the content attribute to "true" if value is true, and "false" otherwise.
- float
- double
- Set the content attribute to an implementation specific string that, if parsed as a <number> using CSS syntax, would return the number value closest to value, given the implementation’s supported real number precision.
SVGLength- Set the content attribute to the value that would be returned
from getting value’s
valueAsStringmember. SVGAngle- Set the content attribute to the value that would be returned
from getting value’s
valueAsStringmember. - SVGRect
-
- Let components be a list of four values, being the values of the x, y, width and height members of value.
- Let serialized components be a list of four strings, where each is an implementation specific string that, if parsed as a <number> using CSS syntax, would return the number value closest to the corresponding value in components, given the implementation’s supported real number precision.
- Set the content attribute to a string consisting of the strings in serialized components joined and separated by single U+0020 SPACE characters.
- DOMString
- Set the content attribute to value.
SVGNumberListSVGLengthListSVGPointListSVGTransformListSVGStringList-
-
Let elements be the list of values in value.
The values will be
SVGNumber,SVGLength, SVGPoint orSVGTransformobjects, or DOMString values, depending on value’s type. -
Let serialized elements be a list of strings, where each
string is formed based on the corresponding value in elements
and its type:
- an
SVGNumberobject - The string is an implementation specific string that, if parsed
as a <number> using CSS syntax, would return the number
value closest to the
SVGNumberobject’svaluemember, given the implementation’s supported real number precision. - an
SVGLengthobject - The string is the value that would be returned
from getting the value’s
valueAsStringmember. - a SVGPoint object
-
The string value is computed as follows:
- Let string be an empty string.
- Let x and y be the values of the SVGPoint object’s x and y coordinates, respectively.
- Append to string an implementation specific string that, if parsed as <number> using CSS syntax, would return the number value closest to x, given the implementation’s supported real number precision.
- Append a single U+002C COMMA character to string.
- Append to string an implementation specific string that, if parsed as <number> using CSS syntax, would return the number value closest to y, given the implementation’s supported real number precision.
- The string is string.
- a
SVGTransformobject - The string is the serialization
of the
SVGTransformobject’s matrix object. - a DOMString
- The string is the DOMString’s value itself.
- an
- Set the content attribute to a string consisting of the strings in serialized elements joined and separated by single U+0020 SPACE characters.
-
Let elements be the list of values in value.
4.3.6. Reflecting an empty initial value
When initializing an SVG DOM attribute that reflects a null or empty initial value, then the property must be initialized according to its data type, as defined in this section. This occurs only if there is no explicit value for the reflected content attribute, and the initial value in the attribute’s definition table is (none).
If an interface is not listed below that means
that the object initialization shall be done using the values for the
objects that the interface contains, e.g.,
an SVGAnimatedString consists of two DOMString members,
while a SVGRect consists of many doubles.
- DOMString
- Initialized as the empty string ("").
- float
- long
- short
- Any other numeric type defined in WebIDL
- long
- Initialized as 0.
- boolean
- Initialized as false.
SVGLength- Initialized as 0 user units
(
SVG_LENGTHTYPE_NUMBER). SVGLengthListSVGNumberListSVGPointListSVGStringListSVGTransformList- Initialized as the empty list.
SVGAngle- Initialized as 0 in unspecified units
(
SVG_ANGLETYPE_UNSPECIFIED). SVGPreserveAspectRatio- Initialized as 'xMidYMid meet'.
If textElement.dx.baseVal is accessed
(where textElement is an instance of SVGTextElement)
and the ‘dx’ attribute was not specified in the document, the
returned SVGLengthList object would be empty.
4.3.7. Invalid values
If a script sets a reflected DOM attribute to an invalid value for the content attribute (e.g., a negative number for an attribute that requires a non-negative number), unless this specification indicates otherwise, no exception shall be raised on setting, but the given document fragment shall become technically in error as described in Error processing.
DOM attributes that reflect enumerated values using integer constants are an exception: these throw a TypeError when set to an out-of-range integer, or to the constant (0) that represents an unknown attribute value. This is consistent with the behavior of the WebIDL enumeration type [WebIDL].
4.4. DOM interfaces for SVG elements
4.4.1. Interface SVGElement
All of the SVG DOM interfaces that correspond directly to elements in the
SVG language (such as the SVGPathElement interface for the
‘path’ element) derive from the SVGElement interface.
The CSSOM specification
augments
SVGElement with a style IDL attribute, so that the ‘style’
attribute can be accessed in the same way as on HTML elements.
[Exposed =Window ]interface :SVGElement Element { [SameObject ]readonly attribute SVGAnimatedString className ;readonly attribute SVGSVGElement ?ownerSVGElement ;readonly attribute SVGElement ?viewportElement ; };SVGElement includes GlobalEventHandlers ;SVGElement includes HTMLOrSVGOrMathMLElement ;
The IDL attribute
reflects the ‘classNameclass’ attribute.
This attribute is deprecated and may be removed in a future version of this specification. Authors are advised to use Element.classList instead.
The className
attribute on SVGElement overrides the correspond attribute on
Element, following the WebIDL rules for
inheritance.
The IDL attribute
represents the nearest ancestor ‘ownerSVGElementsvg’ element. On getting
ownerSVGElement,
the nearest ancestor ‘svg’ element is returned; if the current
element is the outermost svg element, then null is returned.
The IDL attribute
represents the element that provides the SVG viewport for the current element. On getting
viewportElementviewport,
the nearest ancestor element that establishes an SVG viewport is returned; if the current
element is the outermost svg element, then null is returned.
4.4.2. Interface SVGGraphicsElement
| SVG 2 Requirement: | Detect if a mouse event is on the fill or stroke of a shape. |
|---|---|
| Resolution: | SVG 2 will make it easier to detect if an mouse event is on the stroke or fill of an element. |
| Purpose: | To allow authors to discriminate between pointer events on the fill and stroke of an element without having to duplicate the element |
| Owner: | Cameron (ACTION-3279) |
| Status: | Done. |
The SVGGraphicsElement interface represents SVG elements whose primary purpose
is to directly render graphics into a group.
dictionary {SVGBoundingBoxOptions boolean =fill true ;boolean =stroke false ;boolean =markers false ;boolean =clipped false ; }; [Exposed =Window ]interface :SVGGraphicsElement SVGElement { [SameObject ]readonly attribute SVGAnimatedTransformList transform ;SVGRect getBBox (optional SVGBoundingBoxOptions = {});options SVGMatrix ?getCTM ();SVGMatrix ?getScreenCTM (); };SVGGraphicsElement includes SVGTests ;
The IDL attribute
reflects the computed value of the transform property and its
corresponding ‘transform’ presentation attribute.transform
The method is used
to compute the bounding box of the current element. When the getBBox(options)
method is called, the bounding box algorithm
is invoked for the current element,
with fill, stroke, markers
and clipped members of the options dictionary argument
used to control which parts of the element are included in the bounding box,
using the element’s user coordinate system as the coordinate system to return the
bounding box in. A newly created SVGRect object that defines the
computed bounding box is returned. If the element’s geometric attributes
are missing or have invalid values (e.g. negative width or height),
such that the element is not rendered, then a SVGRect with x, y,
width and height all set to 0 is returned.getBBox
The method is used to
get the matrix that transforms the current element’s coordinate system to
its SVG viewport’s coordinate system. When getCTM() is called, the following
steps are run:getCTM
- If the current element is not in the document, then return null.
- If the current element is a non-rendered element, and the UA is not able to resolve the style of the element, then return null.
-
Let ctm be a matrix determined based on what the
current element is:
- the current element is the outermost svg element
- ctm is a matrix that transforms the coordinate
space of the ‘
svg’ (including its transform property) to the coordinate space of the document’s viewport. The matrix includes the transforms produced by the ‘viewBox’ and ‘preserveAspectRatio’ attributes, the transform property, and any transform due tocurrentScaleandcurrentTranslateproperties on theSVGSVGElement. - any other element
- ctm is a matrix that transforms the coordinate space of the current element (including its transform property) to the coordinate space of its closest ancestor viewport-establishing element (also including its transform property).
- Return a newly created, detached SVGMatrix object that represents the same matrix as ctm.
The method
is used to get the matrix that transforms the current element’s coordinate
system to the coordinate system of the SVG viewport for the SVG document fragment.
When getScreenCTM() is called, the following steps are run:getScreenCTM
- If the current element is not in the document, then return null.
- If the current element is a non-rendered element, and the UA is not able to resolve the style of the element, then return null.
-
Let ctm be a matrix that transforms the coordinate
space of the current element (including its transform property)
to the coordinate space of the document’s viewport.
This will include:
- all of the transforms from the current element up to the outermost svg element
- any transforms due to ‘viewBox’, ‘preserveAspectRatio’,
the transform property and any transform
due to
currentScaleandcurrentTranslateproperties on theSVGSVGElementfor the outermost svg element - any transforms from the SVG viewport’s coordinate space to the document’s viewport, i.e. taking into account the positions of all of the CSS boxes from the outermost svg element’s box to the initial containing block when the SVG document fragment is inline in an HTML document
- Return a newly created, detached SVGMatrix object that represents the same matrix as ctm.
This method would have been more aptly named as getClientCTM,
but the name getScreenCTM is kept for historical reasons.
4.4.3. Interface SVGGeometryElement
Interface SVGGeometryElement represents SVG elements whose rendering
is defined by geometry with an equivalent path,
and which can be filled and stroked.
This includes paths and the basic shapes.
[Exposed =Window ]interface :SVGGeometryElement SVGGraphicsElement { [SameObject ]readonly attribute SVGAnimatedNumber pathLength ;boolean isPointInFill (optional DOMPointInit = {});point boolean isPointInStroke (optional DOMPointInit = {});point float getTotalLength ();SVGPoint getPointAtLength (float ); };distance
The method,
when invoked, must return true if the point given by point passed to the method,
in the coordinate space of an element, is inside the intended path as determined by the winding
rule indicated by the fill-rule property of an element; and must return false otherwise.
Open subpaths must be implicitly closed when computing the area inside the path, without affecting
the actual subpaths. Points on the path itself must be considered to be inside the path.
The returned value is independent of any visual CSS property but fill-rule
If either of the x or y properties on point are infinite or NaN,
then the method must return false. If current element is a non-rendered element, and the UA is not able to compute the geometry of the element, then
throw an InvalidStateError.
isPointInFill
isPointInFill takes the winding
rule indicated by the fill-rule property of an element even if the element is a child
of a ‘clipPath’ element.
isPointInFill is aligned
with the isPointInPath method on the CanvasDrawPath mixin as much as the SVG context
allows it to be.
The method,
when invoked, must return true if the point given by point passed to the method,
in the coordinate space of an element, is in or on the outline path of an applied stroke on
an element; and must return false otherwise.
The outline path must take the stroke properties stroke-width,
stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-dasharray,
stroke-dashoffset and vector-effect of an element into account. See sections
Computing the shape of the stroke and
Vector effects for details.
The returned value is independent of any visual CSS property but the listed stroke properties.
If either of the x or y properties on point are infinite or NaN,
then the method must return false. If current element is a non-rendered element, and the UA is not able to compute the geometry of the element, then
throw an InvalidStateError.
isPointInStroke
isPointInStroke is aligned
with the isPointInStroke method on the CanvasDrawPath mixin as much as the SVG context
allows it to be.
The IDL attribute
reflects the ‘pathLength’ content attribute.pathLength
The method
is used to compute the length of the path. When getTotalLength()
is called, the user agent’s computed value for the total length of the path,
in user units, is returned. If current element is a non-rendered element, and the UA is not able to compute the total length of the path, then
throw an InvalidStateError.getTotalLength
The user agent’s computed path length does not take the ‘pathLength’ attribute into account.
The method
is used to return the point at a given distance along the path. When
getPointAtLength(distance) is called, the following steps are run:getPointAtLength
- If current element is a non-rendered element, and the UA is not able to compute the total length of the path, then throw an InvalidStateError.
-
Let length be the user agent’s computed value for the total
length of the path, in user units.
As with
getTotalLength, this does not take into account the ‘pathLength’ attribute. - Clamp distance to [0, length].
- Let (x, y) be the point on the path at distance distance.
- Return a newly created, detached SVGPoint object representing the point (x, y).
4.5. DOM interfaces for basic data types
4.5.1. Interface SVGNumber
The SVGNumber interface is used primarily to represent a <number>
value that is a part of an SVGNumberList. Individual SVGNumber
objects can also be created by script.
An SVGNumber object can be designated as read only,
which means that attempts to modify the object will result in an exception
being thrown, as described below.
SVGNumber objects reflected through the animVal IDL attribute are always
read only.
An SVGNumber object can be associated
with a particular element. The associated element is used to
determine which element’s content attribute to update if the object reflects
an attribute. Unless otherwise described, an SVGNumber object is not
associated with any element.
Every SVGNumber object operates in one of two
modes. It can:
- reflect an element of the base value of a reflected animatable
attribute (being exposed through the methods on the
baseValmember of anSVGAnimatedNumberList), - be detached, which is the case for
SVGNumberobjects created withcreateSVGNumber.
An SVGNumber object maintains an internal number value,
which is called its value.
[Exposed =Window ]interface {SVGNumber attribute float value ; };
The IDL attribute
represents the number. On getting valuevalue,
the SVGNumber’s value is returned.
On setting value, the following
steps are run:
- If the
SVGNumberis read only, then throw a NoModificationAllowedError. - Set the
SVGNumber’s value to the value being assigned to thevaluemember. - If the
SVGNumberreflects an element of the base value of a reflected attribute, then reserialize the reflected attribute.
4.5.2. Interface SVGLength
The SVGLength interface is used to represent a value that
can be a <length>, <percentage> or
<number> value.
An SVGLength object can be designated as read only,
which means that attempts to modify the object will result in an exception
being thrown, as described below.
SVGLength objects reflected through the animVal IDL attribute are always
read only.
An SVGLength object can be associated
with a particular element, as well as being designated with a directionality:
horizontal, vertical or unspecified. The associated element and the directionality of the
length are used to resolve percentage values to user units and is also used to
determine which element’s content attribute to update if the object reflects
an attribute. Unless otherwise
described, an SVGLength object is not associated with any element and
has unspecified directionality.
Every SVGLength object operates in one of
four modes. It can:
- reflect the base value of a reflected animatable attribute
(being exposed through the
baseValmember of anSVGAnimatedLength), - reflect a presentation attribute value
(such as by
SVGRectElement.width.baseVal), - reflect an element of the base value of a reflected animatable
attribute (being exposed through the methods on the
baseValmember of anSVGAnimatedLengthList), or - be detached, which is the case for
SVGLengthobjects created withcreateSVGLength.
An SVGLength object maintains an internal <length> or
<percentage> or <number> value, which is called its
value.
[Exposed =Window ]interface { // Length Unit TypesSVGLength const unsigned short SVG_LENGTHTYPE_UNKNOWN = 0;const unsigned short SVG_LENGTHTYPE_NUMBER = 1;const unsigned short SVG_LENGTHTYPE_PERCENTAGE = 2;const unsigned short SVG_LENGTHTYPE_EMS = 3;const unsigned short SVG_LENGTHTYPE_EXS = 4;const unsigned short SVG_LENGTHTYPE_PX = 5;const unsigned short SVG_LENGTHTYPE_CM = 6;const unsigned short SVG_LENGTHTYPE_MM = 7;const unsigned short SVG_LENGTHTYPE_IN = 8;const unsigned short SVG_LENGTHTYPE_PT = 9;const unsigned short SVG_LENGTHTYPE_PC = 10;readonly attribute unsigned short unitType ;attribute float value ;attribute float valueInSpecifiedUnits ;attribute DOMString valueAsString ;undefined newValueSpecifiedUnits (unsigned short ,unitType float );valueInSpecifiedUnits undefined convertToSpecifiedUnits (unsigned short ); };unitType
The numeric length unit type constants defined on SVGLength are used
to represent the type of an SVGLength’s value.
Their meanings are as follows:
| Constant | Meaning |
|---|---|
| A unitless <number> interpreted as a value in px. |
| A <percentage>. |
| A <length> with an em unit. |
| A <length> with an ex unit. |
| A <length> with a px unit. |
| A <length> with a cm unit. |
| A <length> with a mm unit. |
| A <length> with an in unit. |
| A <length> with a pt unit. |
| A <length> with a pc unit. |
| Some other type of value. |
The use of numeric length unit type constants is an anti-pattern and
new constant values will not be introduced for any other units or length types supported by
SVGLength. If other types of lengths are supported and used, the SVGLength
uses the SVG_LENGTHTYPE_UNKNOWN
unit type. See below for details on how the other properties of an SVGLength
operate with these types of lengths.
The IDL attribute represents
the type of value that the unitTypeSVGLength’s value is.
On getting unitType, the following steps
are run:
- If the
SVGLength’s value is a unitless <number>, a <percentage>, or a <length> with an em, ex, px, cm, mm, in, pt or pc unit, then return the corresponding constant value from the length unit type table above. -
Otherwise, return
SVG_LENGTHTYPE_UNKNOWN.For example, for a <length> with a ch unit or one that has a non-scalar value such as calc(),
SVG_LENGTHTYPE_UNKNOWNwould be returned.
The IDL attribute represents
the valueSVGLength’s value in user units.
On getting value, the following steps
are run:
- Let value be the
SVGLength’s value. - If value is a <number>, return that number.
-
Let viewport size be a basis to resolve percentages against, based on the
SVGLength’s associated element and directionality:- has no associated element
- viewport size is 100
- has an associated element and horizontal directionality
- viewport size is the width of the associated element’s SVG viewport
- has an associated element and vertical directionality
- viewport size is the height of the associated element’s SVG viewport
- has an associated element and unspecified directionality
- viewport size is the length of the associated element’s SVG viewport diagonal (see Units)
-
Let font size be a basis to resolve font size values against,
based on the
SVGLength’s associated element:- has no associated element
- font size is the absolute length of the initial value of the font-size property
- has an associated element
- font size is the computed value of the associated element’s font-size property
- Return the result of converting value to an absolute length, using viewport size and font size as percentage and font size bases. If the conversion is not possible due to the lack of an associated element, return 0.
On setting value, the following steps
are run:
- If the
SVGLengthobject is read only, then throw a NoModificationAllowedError. - Let value be the value being assigned to
value. - Set the
SVGLength’s value to a <number> whose value is value. - If the
SVGLengthreflects the base value of a reflected attribute, reflects a presentation attribute, or reflects an element of the base value of a reflected attribute, then reserialize the reflected attribute.
The IDL attribute represents
the numeric factor of the valueInSpecifiedUnitsSVGLength’s value.
On getting valueInSpecifiedUnits, the following steps
are run:
- Let value be the
SVGLength’s value. - If value is a <number>, return that number.
- Otherwise, if value is a <percentage> or any scalar <length> value, return the numeric factor before its unit.
-
Otherwise, return 0.
Thus
valueInSpecifiedUnitswould return 12 for both '12%' and 12em, but 0 would be returned for non-scalar values like calc(12px + 5%).
On setting valueInSpecifiedUnits, the following steps
are run:
- If the
SVGLengthobject is read only, then throw a NoModificationAllowedError. - Let value be the value being assigned to
valueInSpecifiedUnits. - If the
SVGLength’s value is a <number>, then update its value to value. - Otherwise, if the
SVGLength’s value is a <percentage> or a scalar-valued <length>, then update its numeric factor to value. - Otherwise, the
SVGLength’s value is of some other type. Set it to a <number> whose value is value. - If the
SVGLengthreflects the base value of a reflected attribute or reflects an element of the base value of a reflected attribute, then reserialize the reflected attribute.
The IDL attribute represents
the valueAsStringSVGLength’s value as a string.
On getting valueAsString, the following steps
are run:
- Let value be the
SVGLength’s value. - Let string be an empty string.
-
If value is a <number>, <percentage>
or scalar <length> value, then:
- Let factor be value’s numeric factor, if it is a <percentage> or <length>, or value itself it is a <number>.
- Append to string an implementation specific string that, if parsed as a <number> using CSS syntax, would return the number value closest to factor, given the implementation’s supported real number precision.
- If value is a <percentage> then append to string a single U+0025 PERCENT SIGN character.
- Otherwise, if value is a <length>, then append to string the canonical spelling of value’s unit.
- Return string.
- Otherwise, return an implementation specific string that, if parsed as a <length>, would return the closest length value to value, given the implementation’s supported real number precision.
On setting valueAsString, the following steps
are run:
- If the
SVGLengthobject is read only, then throw a NoModificationAllowedError. - Let value be the value being assigned to
valueAsString. - Parse value using the CSS syntax [ <number> | <length> | <percentage> ].
- If parsing failed, then throw a SyntaxError.
- Otherwise, parsing succeeded. Set
SVGLength’s value to the parsed value. - If the
SVGLengthreflects the base value of a reflected attribute or reflects an element of the base value of a reflected attribute, then reserialize the reflected attribute.
The
method is used to set the newValueSpecifiedUnitsSVGLength’s value in a typed manner. When
newValueSpecifiedUnits(unitType, valueInSpecifiedUnits) is called, the following
steps are run:
- If the
SVGLengthobject is read only, then throw a NoModificationAllowedError. - If unitType is
SVG_LENGTHTYPE_UNKNOWNor is a value that does not appear in the length unit type table above, then throw a NotSupportedError. -
Set
SVGLength’s value depending on the value of unitType:SVG_LENGTHTYPE_NUMBER- a <number> whose value is valueInSpecifiedUnits
SVG_LENGTHTYPE_PERCENTAGE- a <percentage> whose numeric factor is valueInSpecifiedUnits
- anything else
- a <length> whose numeric factor is valueInSpecifiedUnits and whose unit is as indicated by the length unit type table above
- If the
SVGLengthreflects the base value of a reflected attribute or reflects an element of the base value of a reflected attribute, then reserialize the reflected attribute.
The
method is used to convert the convertToSpecifiedUnitsSVGLength’s value to a specific type.
When convertToSpecifiedUnits(unitType) is called, the following steps are run:
- If the
SVGLengthobject is read only, then throw a NoModificationAllowedError. - If unitType is
SVG_LENGTHTYPE_UNKNOWNor is a value that does not appear in the length unit type table above, then throw a NotSupportedError. - Let absolute be the value that would be returned from the
valuemember. -
If unitType is
SVG_LENGTHTYPE_NUMBER, then: -
Otherwise, if unitType is
SVG_LENGTHTYPE_PERCENTAGE, then:-
Let viewport size be a basis to resolve percentages against, based on the
SVGLength’s associated element and directionality:- has no associated element
- viewport size is 100
- has an associated element and horizontal directionality
- viewport size is the width of the associated element’s SVG viewport
- has an associated element and vertical directionality
- viewport size is the height of the associated element’s SVG viewport
- has an associated element and unspecified directionality
- viewport size is the length of the associated element’s SVG viewport diagonal (see Units)
- Set the
SVGLength’s value to the result of converting absolute to a <percentage>, using viewport size as the percentage basis.
-
Let viewport size be a basis to resolve percentages against, based on the
-
Otherwise, if unitType is
SVG_LENGTHTYPE_EMSorSVG_LENGTHTYPE_EXS, then:-
Let font size be a basis to resolve font size values against,
based on the
SVGLength’s associated element:- has no associated element
- font size is the absolute length of the initial value of the font-size property
- has an associated element
- font size is the computed value of the associated element’s font-size property
- Set the
SVGLength’s value to the result of converting absolute to a <length> with an em or ex unit (depending on unitType), using font size as the font-size basis.
-
Let font size be a basis to resolve font size values against,
based on the
- Otherwise:
- If the
SVGLengthreflects the base value of a reflected attribute or reflects an element of the base value of a reflected attribute, then reserialize the reflected attribute.
4.5.3. Interface SVGAngle
The SVGAngle interface is used to represent a value that
can be an <angle> or <number> value.
An SVGAngle object can be designated as read only,
which means that attempts to modify the object will result in an exception
being thrown, as described below. An SVGAngle reflected through the
animVal attribute is always read only.
An SVGAngle object can be associated
with a particular element. The associated element is used to
determine which element’s content attribute to update if the object reflects
an attribute. Unless otherwise described, an SVGAngle object is not
associated with any element.
Every SVGAngle object operates in one of
two modes. It can:
- reflect the base value of a reflected animatable attribute
(being exposed through the
baseValmember of anSVGAnimatedAngle), - be detached, which is the case for
SVGAngleobjects created withcreateSVGAngle.
An SVGAngle object maintains an internal <angle> or
<number> value, which is called its value.
[Exposed =Window ]interface { // Angle Unit TypesSVGAngle const unsigned short SVG_ANGLETYPE_UNKNOWN = 0;const unsigned short SVG_ANGLETYPE_UNSPECIFIED = 1;const unsigned short SVG_ANGLETYPE_DEG = 2;const unsigned short SVG_ANGLETYPE_RAD = 3;const unsigned short SVG_ANGLETYPE_GRAD = 4;readonly attribute unsigned short unitType ;attribute float value ;attribute float valueInSpecifiedUnits ;attribute DOMString valueAsString ;undefined newValueSpecifiedUnits (unsigned short ,unitType float );valueInSpecifiedUnits undefined convertToSpecifiedUnits (unsigned short ); };unitType
The numeric angle unit type constants defined on SVGAngle are used
to represent the type of an SVGAngle’s value.
Their meanings are as follows:
| Constant | Meaning |
|---|---|
| A unitless <number> interpreted as a value in degrees. |
| An <angle> with a deg unit. |
| An <angle> with a rad unit. |
| An <angle> with a grad unit. |
| Some other type of value. |
The use of numeric angle unit type constants is an anti-pattern and
new constant values will not be introduced for any other units or angle types supported by
SVGAngle. If other types of angles are supported and used, the SVGAngle
uses the SVG_ANGLETYPE_UNKNOWN
unit type. See below for details on how the other properties of an SVGAngle
operate with these types of angles.
The IDL attribute represents
the type of value that the unitTypeSVGAngle’s value is.
On getting unitType, the following steps
are run:
- If the
SVGAngle’s value is a unitless <number> or a <angle> with a deg, rad or grad unit, then return the corresponding constant value from the angle unit type table above. -
Otherwise, return
SVG_ANGLETYPE_UNKNOWN.For example, for an <angle> with a turn unit,
SVG_ANGLETYPE_UNKNOWNwould be returned.
The IDL attribute represents
the valueSVGAngle’s value in degrees.
On getting value, the following steps
are run:
- Let value be the
SVGAngle’s value. - If value is a <number>, return that number.
- Return the result of converting value to an angle in degrees.
On setting value, the following steps
are run:
- If the
SVGAngleobject is read only, then throw a NoModificationAllowedError. - Let value be the value being assigned to
value. - Set the
SVGAngle’s value to a <number> whose value is value. - If the
SVGAnglereflects the base value of a reflected attribute, then reserialize the reflected attribute.
The IDL attribute represents
the numeric factor of the valueInSpecifiedUnitsSVGAngle’s value.
On getting valueInSpecifiedUnits, the following steps
are run:
- Let value be the
SVGAngle’s value. - If value is a <number>, return that number.
- Otherwise, value is an <angle> value. Return the numeric factor before its unit.
On setting valueInSpecifiedUnits, the following steps
are run:
- If the
SVGAngleobject is read only, then throw a NoModificationAllowedError. - Let value be the value being assigned to
valueInSpecifiedUnits. - If the
SVGAngle’s value is a <number>, then update its value to value. - Otherwise, if the
SVGAngle’s value is an <angle>, then update its numeric factor to value. - If the
SVGAnglereflects the base value of a reflected attribute or reflects an element of the base value of a reflected attribute, then reserialize the reflected attribute.
The IDL attribute represents
the valueAsStringSVGAngle’s value as a string.
On getting valueAsString, the following steps
are run:
- Let value be the
SVGAngle’s value. - Let string be an empty string.
- Let factor be value’s numeric factor, if it is an <angle>, or value itself it is a <number>.
- Append to string an implementation specific string that, if parsed as a <number> using CSS syntax, would return the number value closest to factor, given the implementation’s supported real number precision.
- If value is an <angle>, then append to string the canonical spelling of value’s unit.
- Return string.
On setting valueAsString, the following steps
are run:
- If the
SVGAngleobject is read only, then throw a NoModificationAllowedError. - Let value be the value being assigned to
valueAsString. - Parse value using the CSS syntax [ <number> | <angle> ].
- If parsing failed, then throw a SyntaxError.
- Otherwise, parsing succeeded. Set
SVGAngle’s value to the parsed value. - If the
SVGAnglereflects the base value of a reflected attribute or reflects an element of the base value of a reflected attribute, then reserialize the reflected attribute.
The
method is used to set the newValueSpecifiedUnitsSVGAngle’s value in a typed manner. When
newValueSpecifiedUnits(unitType, valueInSpecifiedUnits) is called, the following
steps are run:
- If the
SVGAngleobject is read only, then throw a NoModificationAllowedError. - If unitType is
SVG_ANGLETYPE_UNKNOWNor is a value that does not appear in the angle unit type table above, then throw a NotSupportedError. -
Set
SVGAngle’s value depending on the value of unitType:SVG_ANGLETYPE_UNSPECIFIED- a <number> whose value is valueInSpecifiedUnits
- anything else
- an <angle> whose numeric factor is valueInSpecifiedUnits and whose unit is as indicated by the angle unit type table above
- If the
SVGAnglereflects the base value of a reflected attribute or reflects an element of the base value of a reflected attribute, then reserialize the reflected attribute.
The
method is used to convert the convertToSpecifiedUnitsSVGAngle’s value to a specific type.
When convertToSpecifiedUnits(unitType) is called, the following steps are run:
- If the
SVGAngleobject is read only, then throw a NoModificationAllowedError. - If unitType is
SVG_ANGLETYPE_UNKNOWNor is a value that does not appear in the angle unit type table above, then throw a NotSupportedError. - Let degrees be the value that would be returned from the
valuemember. -
If unitType is
SVG_ANGLETYPE_UNSPECIFIED, then: - Otherwise:
- If the
SVGAnglereflects the base value of a reflected attribute or reflects an element of the base value of a reflected attribute, then reserialize the reflected attribute.
4.5.4. List interfaces
| SVG 2 Requirement: | Make the SVGList* interfaces a bit more like other lists/arrays. |
|---|---|
| Resolution: | Add array style indexing and .length and .item to svg list types. |
| Purpose: | To align with other array types (e.g. NodeList). Already implemented in Opera and Firefox. |
| Owner: | Erik (ACTION-2975) |
| Status: | Done |
Some SVG attributes contain lists of values, and to represent these values
there are a number of SVG DOM list interfaces, one
for each required element type – SVGNumberList, SVGLengthList,
SVGPointList, SVGTransformList and SVGStringList.
The first four are used to represent the base and
animated components of SVGAnimatedNumberList, SVGAnimatedLengthList,
SVGAnimatedPoints and SVGTransformList objects,
while the fifth, SVGStringList, is used to reflect a
few unanimated attributes that take a list of strings.
Most list interfaces take the following form:
interface SVGNameList {
readonly attribute unsigned long length;
readonly attribute unsigned long numberOfItems;
undefined clear();
Type initialize(Type newItem);
getter Type getItem(unsigned long index);
Type insertItemBefore(Type newItem, unsigned long index);
Type replaceItem(Type newItem, unsigned long index);
Type removeItem(unsigned long index);
Type appendItem(Type newItem);
setter undefined (unsigned long index, Type newItem);
};
where Name is a descriptive name for the list element’s
("Number", "Length", "Point", "Transform" or "String") and Type is the IDL type of the
list’s elements (SVGNumber, SVGLength, SVGPoint, SVGTransform or DOMString).
The SVGTransformList interface takes the above form but has
two additional methods on it.
All list interface objects apart from SVGTransformList
reflect the base value of a reflected content
attribute. SVGTransformList objects reflect a presentation
attribute (‘transform’,
‘gradientTransform’ or ‘patternTransform’).
All list interface objects are associated with a particular element.
Unlike SVGLength and similar objects, there are no "detached"
list interface objects.
A list interface object maintains an internal list of elements,
which is referred to in the text below simply as "the list".
The IDL attributes and methods are used to inspect and manipulate elements
of the list. The list can also be changed in response to
changes to the reflected content attribute and to animation of
the content attribute (or, for SVGTransformList objects,
in response to changes to the computed value of the transform
property).
When the list’s element type is an object type, the
elements of the list are those objects and not copies of them.
getItem, the indexed property
getter (declared as getItem in the
IDL above), and every method that returns an element of the list
(initialize,
insertItemBefore,
replaceItem,
appendItem and
consolidate)
return that object. Two accesses of the same index therefore return the same
object, for as long as that object is the element at that index. For a method
that takes an item as its argument, the object returned is not necessarily the
one that was passed, since the method’s steps may have replaced it by a copy.
Whether an object is still the element at an index after the reflected content
attribute changes is decided by the steps for
synchronizing a list interface
object. When the element type is DOMString, elements are returned and
compared by value.
A list interface object can be designated as read only, which means that attempts to modify the object will result in an exception being thrown, as described below. list interface objects reflected through the animVal IDL attribute are always read only.
A list interface object is synchronized by running the following steps:
- Let value be the base value of the reflected content attribute. If the attribute is not present, or if its value cannot be parsed, let value be the attribute’s initial value, or an empty list if the attribute’s initial value is (none).
- Let length be the number of items in the list.
- Let new length be the number of values in value. If value is the keyword none (as supported by the transform property), new length is 0.
-
If the list element type is
SVGNumber,SVGLength, SVGPoint orSVGTransform, then:-
If length > new length, then:
- Detach each object in the list at an index greater than or equal to new length.
- Truncate the list to length new length.
- Set length to new length.
-
While length < new length:
- Let item be a newly created object of the list element type.
- Attach item to this list interface object.
- Append item to the list.
- Set length to length + 1.
- Let index be 0.
-
While index < length:
- Let item be the object in the list at index index.
- Let v be the value in value at index index.
- Set item’s value to v.
- If item is an
SVGTransformobject, then set the components of its matrix object to match the new transform function value. - Set index to index + 1.
-
If length > new length, then:
-
Otherwise, the list element type is DOMString:
- Replace the list with a new list consisting of the values in value.
Whenever a list element object is to be detached, the following steps are run, depending on the list element type:
SVGNumber-
Set the
SVGNumberto no longer be associated with any element. If theSVGNumberis read only, set it to be no longer read only. SVGLength-
Set the
SVGLengthto no longer be associated with any element. If theSVGLengthis read only, set it to be no longer read only. Set theSVGLengthto have unspecified directionality. - SVGPoint
- Set the SVGPoint to no longer be associated with any element. If the SVGPoint is read only, set it to be no longer read only.
SVGTransform-
Set the
SVGTransformto no longer be associated with any element. If theSVGTransformis read only, set it to be no longer read only. - DOMString
- Nothing is done.
Whenever a list element object is to be attached, the following steps are run, depending on the list element type:
SVGNumber-
Associate the
SVGNumberwith the element that the list interface object is associated with. Additionally, depending on which IDL attribute the list interface object is reflected through:- baseVal
- Set the
SVGNumberto reflect an element of the base value. - animVal
- Set the
SVGNumberto reflect an element of the base value.
SVGLength-
Associate the
SVGLengthwith the element that the list interface object is associated with and set its directionality to that specified by the attribute being reflected. Additionally, depending on which IDL attribute the list interface object is reflected through:- baseVal
- Set the
SVGLengthto reflect an element of the base value. - animVal
- Set the
SVGLengthto reflect an element of the base value. Set theSVGLengthto be read only.
- SVGPoint
-
Associate the
SVGPoint with the element that the list interface
object is associated with.
Additionally, depending on which IDL attribute the list interface
object is reflected through:
- baseVal
- Set the SVGPoint to reflect an element of the base value.
- animVal
- Set the SVGPoint to reflect an element of the base value.
SVGTransform-
Associate the
SVGTransformwith the element that the list interface object is associated with. Set theSVGTransformto reflect an element of a presentation attribute value. - DOMString
- Nothing is done.
The supported property indices of a list interface object is the set of all non-negative integers less than the length of the list.
The and
length IDL attributes
represents the length of the list, and on getting simply return
the length of the list.numberOfItems
The method is used to
remove all items in the list. When clear() is called, the following steps are run:clear
- If the list is read only, then throw a NoModificationAllowedError.
- Detach and then remove all elements in the list.
- If the list reflects an attribute, or represents the base value of an object that reflects an attribute, then reserialize the reflected attribute.
The method
is used to clear the list and add a single, specified value to it.
When initialize(newItem) is called, the following steps are run:initialize
- If the list is read only, then throw a NoModificationAllowedError.
- Detach and then remove all elements in the list.
- If newItem is an object type, and newItem is not a detached object, then set newItem to be a newly created object of the same type as newItem and which has the same (number or length) value.
- Attach newItem to the list interface object.
- Append newItem to this list.
- If the list reflects an attribute, or represents the base value of an object that reflects an attribute, then reserialize the reflected attribute.
- Return newItem.
The method is used
to get an item from the list at the specified position. When
getItem(index) is called, the following steps are run:getItem
- If index is greater than or equal to the length of the list, then throw an IndexSizeError.
-
Return the element in the list at position index.
Note that if the list’s element type is an object type, such as
SVGLength, then a reference to that object and not a copy of it is returned.
The
method is used to insert an element into the list at a specific position.
When insertItemBefore(newItem, index) is called,
the following steps are run:insertItemBefore
- If the list is read only, then throw a NoModificationAllowedError.
- If newItem is an object type, and newItem is not a detached object, then set newItem to be a newly created object of the same type as newItem and which has the same (number or length) value.
- If index is greater than the length of the list, then set index to be the list length.
- Insert newItem into the list at index index.
- Attach newItem to the list interface object.
- If the list reflects an attribute, or represents the base value of an object that reflects an attribute, then reserialize the reflected attribute.
- Return newItem.
The method
is used to replace an existing item in the list with a new item.
When replaceItem(newItem, index) is called, the
following steps are run:replaceItem
- If the list is read only, then throw a NoModificationAllowedError.
- If index is greater than or equal to the length of the list, then throw an IndexSizeError.
- If newItem is an object type, and newItem is not a detached object, then set newItem to be a newly created object of the same type as newItem and which has the same (number or length) value.
- Detach the element in the list at index index.
- Replace the element in the list at index index with newItem.
- Attach newItem to the list interface object.
- If the list reflects an attribute, or represents the base value of an object that reflects an attribute, then reserialize the reflected attribute.
- Return newItem.
The method
is used to remove an item from the list. When removeItem(index)
is called, the following steps are run:removeItem
- If the list is read only, then throw a NoModificationAllowedError.
- If index is greater than or equal to the length of the list, then throw an IndexSizeError with code.
- Let item be the list element at index index.
- Detach item.
- Remove the list element at index index.
- Return item.
The method
is used to append an item to the end of the list. When appendItem(newItem)
is called, the following steps are run:appendItem
- If the list is read only, then throw a NoModificationAllowedError.
- If newItem is an object type, and newItem is not a detached object, then set newItem to be a newly created object of the same type as newItem and which has the same (number or length) value.
- Let index be the length of the list.
- Append newItem to the end of the list.
- Attach newItem to the list interface object.
- If the list reflects an attribute, or represents the base value of an object that reflects an attribute, then reserialize the reflected attribute.
- Return newItem.
The behavior of the indexed property setter
is the same as that for the replaceItem
method.
4.5.5. Interface SVGNumberList
The SVGNumberList interface is a list interface whose
elements are SVGNumber objects. An SVGNumberList object
represents a list of numbers.
[Exposed =Window ]interface {SVGNumberList readonly attribute unsigned long length ;readonly attribute unsigned long numberOfItems ;undefined clear ();SVGNumber initialize (SVGNumber );newItem getter SVGNumber getItem (unsigned long );index SVGNumber insertItemBefore (SVGNumber ,newItem unsigned long );index SVGNumber replaceItem (SVGNumber ,newItem unsigned long );index SVGNumber removeItem (unsigned long );index SVGNumber appendItem (SVGNumber );newItem setter undefined (unsigned long ,index SVGNumber ); };newItem
The behavior of all of the interface members of SVGNumberList are
defined in the List interfaces section above.
4.5.6. Interface SVGLengthList
The SVGLengthList interface is a list interface whose
elements are SVGLength objects. An SVGLengthList object
represents a list of lengths.
[Exposed =Window ]interface {SVGLengthList readonly attribute unsigned long length ;readonly attribute unsigned long numberOfItems ;undefined clear ();SVGLength initialize (SVGLength );newItem getter SVGLength getItem (unsigned long );index SVGLength insertItemBefore (SVGLength ,newItem unsigned long );index SVGLength replaceItem (SVGLength ,newItem unsigned long );index SVGLength removeItem (unsigned long );index SVGLength appendItem (SVGLength );newItem setter undefined (unsigned long ,index SVGLength ); };newItem
The behavior of all of the interface members of SVGLengthList are
defined in the List interfaces section above.
4.5.7. Interface SVGStringList
The SVGStringList interface is a list interface whose
elements are DOMString values. An SVGStringList object
represents a list of strings.
[Exposed =Window ]interface {SVGStringList readonly attribute unsigned long length ;readonly attribute unsigned long numberOfItems ;undefined clear ();DOMString initialize (DOMString );newItem getter DOMString getItem (unsigned long );index DOMString insertItemBefore (DOMString ,newItem unsigned long );index DOMString replaceItem (DOMString ,newItem unsigned long );index DOMString removeItem (unsigned long );index DOMString appendItem (DOMString );newItem setter undefined (unsigned long ,index DOMString ); };newItem
The behavior of all of the interface members of SVGStringList are
defined in the List interfaces section above.
4.6. DOM interfaces for reflecting animatable SVG attributes
The following interfaces are used to represent the reflected value
of animatable content attributes.
They each consist of two component objects, representing the same data:
baseVal and animVal.
The baseVal (base value) object is modifiable,
to update the corresponding attribute value.
In SVG 1.1, the animVal attribute of the SVG DOM interfaces represented the
current animated value of the reflected attribute. In this version of SVG,
animVal no longer represents the current animated value and is instead an
alias of baseVal.
4.6.1. Interface SVGAnimatedBoolean
An SVGAnimatedBoolean object is used to reflect an
animatable attribute that takes a boolean value.
[Exposed =Window ]interface {SVGAnimatedBoolean attribute boolean baseVal ;readonly attribute boolean animVal ; };
The and
baseVal IDL attributes
both represent the current non-animated value of the reflected attribute.
On getting animValbaseVal
or animVal,
the following steps are run:
- Let value be the value of the reflected attribute, or the empty string if it is not present.
- If value is not "true" or "false", then set value to the reflected attribute’s initial value.
- Return true if value is "true", and false otherwise.
On setting baseVal,
the reflected attribute is set to "true" if the value is true, and "false"
otherwise.
4.6.2. Interface SVGAnimatedEnumeration
An SVGAnimatedEnumeration object is used to reflect
an animatable attribute that takes a keyword value (such as
the ‘method’ attribute on ‘textPath’) or to reflect
the type of value that an animatable attribute has (done
only by the orientType
IDL attribute for the ‘marker’ element’s
‘orient’ attribute).
[Exposed =Window ]interface {SVGAnimatedEnumeration attribute unsigned short baseVal ;readonly attribute unsigned short animVal ; };
For SVGAnimatedEnumeration objects that reflect an
animatable attribute that takes only a keyword value, the
and
baseVal IDL attributes
represents the current non-animated value of the reflected attribute.
For animValorientType,
they represent the type of the current non-animated value of the
reflected ‘orient’ attribute. On getting
baseVal or
animVal, the
following steps are run:
- Let value be the value of the reflected attribute (using the attribute’s initial value if it is not present or invalid).
- Return the numeric type value for value, according to the reflecting IDL attribute’s definition.
On setting baseVal,
the following steps are run:
- Let value be the value being assigned to
baseVal. - If value is 0 or is not the numeric type value for any value of the reflected attribute, then throw a TypeError.
- Otherwise, if the reflecting IDL attribute is
orientTypeand value isSVG_MARKER_ORIENT_ANGLE, then set the reflected attribute to the string "0". - Otherwise, value is the numeric type value for a specific, single keyword value for the reflected attribute. Set the reflected attribute to that value.
4.6.3. Interface SVGAnimatedInteger
An SVGAnimatedInteger object is used to reflect an
animatable attribute that takes an integer value (such as
‘numOctaves’ on ‘feTurbulence’). It is also
used to reflect one part of an animatable attribute that takes
an integer followed by an optional second integer (such as
‘order’ on ‘feConvolveMatrix’).
This SVGAnimatedInteger interface
is not used in this specification, however the
Filter Effects
specification has a number of uses of it.
[Exposed =Window ]interface {SVGAnimatedInteger attribute long baseVal ;readonly attribute long animVal ; };
For SVGAnimatedInteger objects that reflect
an animatable attribute that takes a single integer value, the
and
baseVal IDL attributes
represent the current non-animated value of the reflected attribute.
For those that reflect one integer of an attribute that takes an
integer followed by an optional second integer, they represent the
current non-animated value of one of the two integers. On getting
animValbaseVal or
animVal, the
following steps are run:
- Let value be the value of the reflected attribute (using the attribute’s initial value if it is not present or invalid).
-
If the reflected attribute is defined to take an integer
followed by an optional second integer, then:
- If this
SVGAnimatedIntegerobject reflects the first integer, then return the first value in value. -
Otherwise, this
SVGAnimatedIntegerobject reflects the second integer. Return the second value in value if it has been explicitly specified, and if not, return the implicit value as described in the definition of the attribute.For example, the definition of ‘order’ says that the implicit second integer is the same as the explicit first integer.
- If this
- Otherwise, the reflected attribute is defined to take a single integer value. Return value.
On setting baseVal,
the following steps are run:
- Let value be the value being assigned to
baseVal. - Let new be a list of integers.
-
If the reflected attribute is defined to take an integer
followed by an optional second integer, then:
- Let current be the value of the reflected attribute (using the attribute’s initial value if it is not present or invalid).
- Let first be the first integer in current.
- Let second be the second integer in current if it has been explicitly specified, and if not, the implicit value as described in the definition of the attribute.
- If this
SVGAnimatedIntegerobject reflects the first integer, then set first to value. Otherwise, set second to value. - Append first to new.
- Append second to new.
- Otherwise, the reflected attribute is defined to take a single integer value. Append value to new.
- Set the content attribute to a string consisting of each integer in new serialized to an implementation specific string that, if parsed as an <number> using CSS syntax, would return that integer, joined and separated by a single U+0020 SPACE character.
4.6.4. Interface SVGAnimatedNumber
An SVGAnimatedNumber object is used to reflect an
animatable attribute that takes a number value (such as
‘pathLength’ on ‘path’). It is also
used to reflect one part of an animatable attribute that takes
an number followed by an optional second number (such as
‘kernelUnitLength’ on ‘feDiffuseLighting’).
[Exposed =Window ]interface {SVGAnimatedNumber attribute float baseVal ;readonly attribute float animVal ; };
For SVGAnimatedNumber objects that reflect
an animatable attribute that takes a single number value, the
and
baseVal IDL attributes
represent the current non-animated value of the reflected attribute.
For those that reflect one number of an attribute that takes a
number followed by an optional second number, they represent the
current non-animated value of one of the two numbers. On getting
animValbaseVal or
animVal, the
following steps are run:
- Let value be the value of the reflected attribute (using the attribute’s initial value if it is not present or invalid).
-
If the reflected attribute is defined to take an number
followed by an optional second number, then:
- If this
SVGAnimatedNumberobject reflects the first number, then return the first value in value. -
Otherwise, this
SVGAnimatedNumberobject reflects the second number. Return the second value in value if it has been explicitly specified, and if not, return the implicit value as described in the definition of the attribute.For example, the definition of ‘kernelUnitLength’ says that the implicit second number is the same as the explicit first number.
- If this
- Otherwise, the reflected attribute is defined to take a single number value. Return value.
On setting baseVal,
the following steps are run:
- Let value be the value being assigned to
baseVal. - Let new be a list of numbers.
-
If the reflected attribute is defined to take an number
followed by an optional second number, then:
- Let current be the value of the reflected attribute (using the attribute’s initial value if it is not present or invalid).
- Let first be the first number in current.
- Let second be the second number in current if it has been explicitly specified, and if not, the implicit value as described in the definition of the attribute.
- If this
SVGAnimatedNumberobject reflects the first number, then set first to value. Otherwise, set second to value. - Append first to new.
- Append second to new.
- Otherwise, the reflected attribute is defined to take a single number value. Append value to new.
- Set the content attribute to a string consisting of each number in new serialized to an implementation specific string that, if parsed as an <number> using CSS syntax, would return the value closest to the number (given the implementation’s supported Precisionreal number precision), joined and separated by a single U+0020 SPACE character.
4.6.5. Interface SVGAnimatedLength
An SVGAnimatedLength object is used to reflect either
(a) an animatable attribute that takes a <length>,
<percentage> or <number> value, or (b) a
CSS property that takes one of these values and its corresponding
presentation attribute.
[Exposed =Window ]interface { [SVGAnimatedLength SameObject ]readonly attribute SVGLength baseVal ; [SameObject ]readonly attribute SVGLength animVal ; };
The and
baseVal IDL attributes
represent the current value of the reflected content attribute.
On getting animValbaseVal or
animVal,
an SVGLength object is returned that:
- either reflects the base value of the reflected attribute or reflects the given presentation attribute,
- is associated with the SVG element that
the object with the reflecting IDL attribute of type
SVGAnimatedLengthwas obtained from, and - has a directionality as defined by the specific reflected attribute.
4.6.6. Interface SVGAnimatedAngle
An SVGAnimatedAngle object is used to reflect
the <angle> value of the animated ‘orient’
attribute on ‘marker’, through the
orientAngle
IDL attribute.
[Exposed =Window ]interface { [SVGAnimatedAngle SameObject ]readonly attribute SVGAngle baseVal ; [SameObject ]readonly attribute SVGAngle animVal ; };
The and
baseVal IDL attributes represent
the current non-animated <angle> value of the
reflected ‘animValorient’ attribute. On getting
baseVal or
animVal, an
SVGAngle object is returned that:
- reflects the base value of the
reflected ‘
orient’ attribute, and - is associated with the SVG ‘
marker’ element that the object with the reflecting IDL attribute of typeSVGAnimatedAnglewas obtained from.
4.6.7. Interface SVGAnimatedString
An SVGAnimatedString object is used to reflect an
animatable attribute that takes a string value. It can optionally
be defined to additionally reflect a second, deprecated attribute.
[Exposed =Window ]interface {SVGAnimatedString attribute (DOMString or TrustedScriptURL )baseVal ;readonly attribute DOMString animVal ; };
The
and baseVal IDL attributes
represent the current non-animated value of the reflected attribute.
On getting animValbaseVal
or animVal,
the following steps are run:
-
If the reflected attribute is not present, then:
- If the
SVGAnimatedStringobject is defined to additionally reflect a second, deprecated attribute, and that attribute is present, then return its value. - Otherwise, if the reflected attribute has an initial value, then return it.
- Otherwise, return the empty string.
- If the
- Otherwise, the reflected attribute is present. Return its value.
For the href
member on the SVGURIReference interface, this will result in
the deprecated ‘xlink:href’ attribute being returned if it is
present and the ‘href’ attribute is not,
and in the ‘href’ attribute being
returned in all other cases.
On setting baseVal,
the following steps are run:
- If the reflected attribute’s element is an
SVGScriptElement, let value be the result of executing the Get Trusted Type compliant string algorithm, with TrustedScriptURL, reflected attribute’s Document’s relevant global object, 'SVGScriptElement href', and 'script'. - Otherwise, let value be the specified value.
- If the reflected attribute is not present,
the
SVGAnimatedStringobject is defined to additionally reflect a second, deprecated attribute, and that deprecated attribute is present, then set that deprecated attribute to value. - Otherwise, set the reflected attribute to value.
SVG does not have a complete script processing model yet. Trusted Types assumes that the attribute and text body modification protections behave similarly to ones for HTML scripts.
For the href
member on the SVGURIReference interface, this will result in
the deprecated ‘xlink:href’ attribute being set if it is
present and the ‘href’ attribute is not,
and in the ‘href’ attribute being
set in all other cases.
4.6.8. Interface SVGAnimatedRect
An SVGAnimatedRect object is used to reflect an
animatable attribute that takes a rectangle value as specified
by an x, y, width and height.
In this specification the only attribute to be
reflected as an SVGAnimatedRect is ‘viewBox’.
[Exposed =Window ]interface { [SVGAnimatedRect SameObject ]readonly attribute SVGRect baseVal ; [SameObject ]readonly attribute SVGRect animVal ; };
The
and baseVal IDL
attributes represent the current non-animated rectangle value of
the reflected attribute. On getting animValbaseVal
or animVal,
a SVGRect object is returned.
Upon creation of the baseVal
or animVal
SVGRect objects, and afterwards whenever the reflected content attribute
is added, removed, or changed, the following steps are run:
- Let value be the value of the reflected attribute (using the attribute’s initial value if it is not present or invalid).
- Let x, y, width and height be those corresponding components of value.
- Set the SVGRect object’s x coordinate, y coordinate, width and height to x, y, width and height, respectively.
Whenever the
x coordinate,
y coordinate,
width or
height property
of the baseVal or
animVal
SVGRect object changes, except as part of the previous algorithm that
reflects the value of the content attribute into the SVGRect, the reflected
content attribute must be reserialized.
4.6.9. Interface SVGAnimatedNumberList
An SVGAnimatedNumberList object is used to reflect an animatable
attribute that takes a list of <number> values.
[Exposed =Window ]interface { [SVGAnimatedNumberList SameObject ]readonly attribute SVGNumberList baseVal ; [SameObject ]readonly attribute SVGNumberList animVal ; };
The
and baseVal IDL attributes
represent the current non-animated value of the reflected attribute.
On getting animValbaseVal or
animVal,
an SVGNumberList object is returned that reflects the base value
of the reflected attribute.
4.6.10. Interface SVGAnimatedLengthList
An SVGAnimatedLengthList object is used to reflect an animatable
attribute that takes a list of <length>, <percentage>
or <number> values.
[Exposed =Window ]interface { [SVGAnimatedLengthList SameObject ]readonly attribute SVGLengthList baseVal ; [SameObject ]readonly attribute SVGLengthList animVal ; };
The
or baseVal IDL attributes
represent the current non-animated value of the reflected attribute.
On getting animValbaseVal or
animVal,
an SVGLengthList object is returned that reflects the base value
of the reflected attribute.
4.7. Other DOM interfaces
4.7.1. Interface SVGUnitTypes
The SVGUnitTypes interface defines a commonly used set of constants
used for reflecting ‘gradientUnits’, ‘patternContentUnits’ and
other similar attributes.
[Exposed =Window ]interface { // Unit TypesSVGUnitTypes const unsigned short SVG_UNIT_TYPE_UNKNOWN = 0;const unsigned short SVG_UNIT_TYPE_USERSPACEONUSE = 1;const unsigned short SVG_UNIT_TYPE_OBJECTBOUNDINGBOX = 2; };
The unit type constants defined on SVGUnitTypes have the following meanings:
| Constant | Meaning |
|---|---|
| Corresponds to the 'userSpaceOnUse' attribute value. |
| Corresponds to the 'objectBoundingBox' attribute value. |
| Some other type of value. |
4.7.2. Mixin SVGTests
The SVGTests interface is used to reflect
conditional processing attributes, and is mixed in to other
interfaces for elements that support these attributes.
interface mixin SVGTests { [SameObject ]readonly attribute SVGStringList requiredExtensions ; [SameObject ]readonly attribute SVGStringList systemLanguage ; };
The IDL attribute
reflects the ‘requiredExtensions’ content attribute.requiredExtensions
The IDL attribute
reflects the ‘systemLanguage’ content attribute.systemLanguage
4.7.3. Mixin SVGFitToViewBox
The SVGFitToViewBox interface is used to reflect
the ‘viewBox’ and ‘preserveAspectRatio’ attributes,
and is mixed in to other interfaces for elements that support
these two attributes.
interface mixin SVGFitToViewBox { [SameObject ]readonly attribute SVGAnimatedRect viewBox ; [SameObject ]readonly attribute SVGAnimatedPreserveAspectRatio preserveAspectRatio ; };
The IDL attribute
reflects the ‘viewBox’ content attribute.viewBox
The IDL attribute
reflects the ‘preserveAspectRatio’ content attribute.preserveAspectRatio
4.7.4. Mixin SVGURIReference
The SVGURIReference interface is used to reflect
the ‘href’ attribute and the deprecated
‘xlink:href’ attribute.
interface mixin SVGURIReference { [SameObject ]readonly attribute SVGAnimatedString href ; };
The IDL attribute
represents the value of the ‘href’
attribute, and, on elements that are defined to support it,
the deprecated ‘hrefxlink:href’ attribute. On getting
href, an
SVGAnimatedString object is returned that:
- reflects the ‘href’ attribute, and
- if the element is defined to support the deprecated
‘
xlink:href’ attribute, additionally reflects that deprecated attribute.
The SVGAnimatedString interface is defined
to reflect, through its baseVal
and animVal members, the deprecated
‘xlink:href’ attribute, if that attribute is
present and the ‘href’ is not, and to
reflect the ‘href’ attribute in all
other circumstances. Animation elements
treat attributeName='xlink:href'
as being an alias for targeting the ‘href’ attribute.