first

Daisy Diff compare report. Click on the changed parts for a detailed description. Use the left and right arrow keys to walk through the modifications.

last

19.2.11 The 'set' element

The 'set' element provides a simple means of just setting the value of an attribute for a specified duration. It supports all attribute types, including those that cannot reasonably be interpolated, such as string and boolean values. The 'set' element is non-additive. The additive and accumulate attributes are not allowed, and will be ignored if specified.

Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for this element is the SMIL Animation [ SMILANIM] specification. In particular, see SMIL Animation: 'set' element.

<!ENTITY % SVG.set.extra.content "" >
<!ENTITY % SVG.set.element "INCLUDE" >
<![%SVG.set.element;[
<!ENTITY % SVG.set.content
    "( %SVG.Description.class; %SVG.set.extra.content; )*"
>
<!ELEMENT %SVG.set.qname; %SVG.set.content; >
<!-- end of SVG.set.element -->]]>
<!ENTITY % SVG.set.attlist "INCLUDE" >
<![%SVG.set.attlist;[
<!ATTLIST %SVG.set.qname;
    %SVG.Core.attrib;
    %SVG.Conditional.attrib;
    %SVG.AnimationEvents.attrib;
    %SVG.External.attrib;
    %SVG.Animation.attrib;
    %SVG.AnimationAttribute.attrib;
    %SVG.AnimationTiming.attrib;
    to CDATA #IMPLIED
>

([SMILANIM], section 4.2).

For a list of attributes and properties that can be animated using the 'set' element, see Elements, attributes and properties that can be animated.

19.2.12 The 'animateMotion' element

The 'animateMotion' element causes a referenced element to move along a motion path.

Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for this element is the SMIL Animation [ SMILANIM] specification. In particular, see SMIL Animation: 'animateMotion' element.

<!ENTITY % SVG.animateMotion.extra.content "" >
<!ENTITY % SVG.animateMotion.element "INCLUDE" >
<![%SVG.animateMotion.element;[
<!ENTITY % SVG.animateMotion.content
    "(( %SVG.Description.class; )*, %SVG.mpath.qname;?
        %SVG.animateMotion.extra.content; )"
>
<!ELEMENT %SVG.animateMotion.qname; %SVG.animateMot\
ion.content; >
<!-- end of SVG.animateMotion.element -->]]>
<!ENTITY % SVG.animateMotion.attlist "INCLUDE" >
<![%SVG.animateMotion.attlist;[
<!ATTLIST %SVG.animateMotion.qname;
    %SVG.Core.attrib;
    %SVG.Conditional.attrib;
    %SVG.AnimationEvents.attrib;
    %SVG.External.attrib;
    %SVG.Animation.attrib;
    %SVG.AnimationTiming.attrib;
    %SVG.AnimationAddtion.attrib;
    calcMode ( discrete | linear | paced | spline ) 'paced'
    values CDATA #IMPLIED
    keyTimes CDATA #IMPLIED
    keySplines CDATA #IMPLIED
    from CDATA #IMPLIED
    to CDATA #IMPLIED
    by CDATA #IMPLIED
    path CDATA #IMPLIED
    keyPoints CDATA #IMPLIED
    rotate CDATA #IMPLIED
    origin CDATA #IMPLIED
>

([SMILANIM], section 4.3).

<!ENTITY % SVG.mpath.extra.content "" >
<!ENTITY % SVG.mpath.element "INCLUDE" >
<![%SVG.mpath.element;[
<!ENTITY % SVG.mpath.content
    "( %SVG.Description.class; %SVG.mpath.extra.content; )*"
>
<!ELEMENT %SVG.mpath.qname; %SVG.mpath.content; >
<!-- end of SVG.mpath.element -->]]>
<!ENTITY % SVG.mpath.attlist "INCLUDE" >
<![%SVG.mpath.attlist;[
<!ATTLIST %SVG.mpath.qname;
    %SVG.Core.attrib;
    %SVG.XLinkRequired.attrib;
    %SVG.External.attrib;
>

For 'animateMotion', the specified values for 'from', 'by', 'to' and 'values' consists of x, y coordinate pairs, with a single comma and/or white space separating the x coordinate from the y coordinate. For example, from="33,15" specifies an x coordinate value of 33 and a y coordinate value of 15.

If provided, the 'values' attribute must consists of a list of x, y coordinate pairs. Coordinate values are separated by at least one white space character or a comma. Additional white space around the separator is allowed. For example, values="10,20;30,20;30,40" or values="10mm,20mm;30mm,20mm;30mm,40mm". Each coordinate represents a length. Attributes 'from', 'by', 'to' and 'values' specify a shape on the current canvas which represents the motion path.

Two options are available which allow definition of a motion path using any of SVG's path data commands:

• the 'path' attribute defines a motion path directly on 'animateMotion' element using any of SVG's path data commands.
• the 'mpath' sub-element provides the ability to reference an external 'path' element as the definition of the motion path.

Note that SVG's path data commands can only contain values in user space, whereas 'from', 'by', 'to' and 'values' can specify coordinates in user space or using unit identifiers. See Units.

The various (x,y) points of the shape provide a supplemental transformation matrix onto the CTM for the referenced object which causes a translation along the x- and y-axes of the current user coordinate system by the (x,y) values of the shape computed over time. Thus, the referenced object is translated over time by the offset of the motion path relative to the origin of the current user coordinate system. The supplemental transformation is applied on top of any transformations due to the target element's 'transform' attribute or any animations on that attribute due to 'animateTransform' elements on the target element.

The 'additive' and 'accumulate' attributes apply to 'animateMotion' elements. Multiple 'animateMotion' elements all simultaneously referencing the same target element can be additive with respect to each other; however, the transformations which result from the 'animateMotion' elements are always supplemental to any transformations due to the target element's 'transform' attribute or any 'animateTransform' elements.

The default calculation mode ('calcMode') for 'animateMotion' is "paced". This will produce constant velocity motion along the specified path. Note that while animateMotion elements can be additive, it is important to observe that the addition of two or more "paced" (constant velocity) animations might not result in a combined motion animation with constant velocity.

When a path is combined with "discrete", "linear" or "spline" 'calcMode' settings, and if attribute 'keyPoints' is not provided, the number of values is defined to be the number of points defined by the path, unless there are "move to" commands within the path. A "move to" command within the path (i.e. other than at the beginning of the path description) A "move to" command does not count as an additional point when dividing up the duration, or when associating 'keyTimes', 'keySplines' and 'keyPoints' values. When a path is combined with a "paced" 'calcMode' setting, all "move to" commands are considered to have 0 length (i.e. they always happen instantaneously), and is not considered in computing the pacing.

For more flexibility in controlling the velocity along the motion path, the 'keyPoints' attribute provides the ability to specify the progress along the motion path for each of the 'keyTimes' specified values. If specified, 'keyPoints' causes 'keyTimes' to apply to the values in 'keyPoints' rather than the points specified in the 'values' attribute array or the points on the 'path' attribute.

The override rules for 'animateMotion' are as follows. Regarding the definition of the motion path, the 'mpath' element overrides the the 'path' attribute, which overrides 'values', which overrides 'from/by/to', 'by' and 'to'. Regarding determining the points which correspond to the 'keyTimes' attributes, the 'keyPoints' attribute overrides 'path', which overrides 'values', which overrides 'from/by/to', 'by' and 'to'.

At any time t within a motion path animation of duration dur, the computed coordinate (x,y) along the motion path is determined by finding the point (x,y) which is t/dur distance along the motion path using the user agent's distance along the path algorithm.

The following example demonstrates the supplemental transformation matrices that are computed during a motion path animation.

Example animMotion01 shows a triangle moving along a motion path.

<?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="5cm" height="3cm"  viewBox="0 0 500 300"
     xmlns="http://www.w3.org/2000/svg" version="1.1"
     xmlns:xlink="http://www.w3.org/1999/xlink" >
  <desc>Example animMotion01 - demonstrate motion animation computations</desc>
  <rect x="1" y="1" width="498" height="298"
        fill="none" stroke="blue" stroke-width="2" />
  <!-- Draw the outline of the motion path in blue, along
          with three small circles at the start, middle and end. -->
  <path id="path1" d="M100,250 C 100,50 400,50 400,250"
        fill="none" stroke="blue" stroke-width="7.06"  />
  <circle cx="100" cy="250" r="17.64" fill="blue"  />
  <circle cx="250" cy="100" r="17.64" fill="blue"  />
  <circle cx="400" cy="250" r="17.64" fill="blue"  />
  <!-- Here is a triangle which will be moved about the motion path.
       It is defined with an upright orientation with the base of
       the triangle centered horizontally just above the origin. -->
  <path d="M-25,-12.5 L25,-12.5 L 0,-87.5 z"
        fill="yellow" stroke="red" stroke-width="7.06"  >
    <!-- Define the motion path animation -->
    <animateMotion dur="6s" repeatCount="indefinite" rotate="auto" >
       <mpath xlink:href="#path1"/>
    </animateMotion>
  </path>
</svg>

Example animMotion01

At zero seconds

At three seconds

At six seconds

View this example as SVG (SVG-enabled browsers only)

The following table shows the supplemental transformation matrices that are applied to achieve the effect of the motion path animation.

For a list of elements that can be animated using the 'animateMotion' element, see Elements, attributes and properties that can be animated.

19.2.13 The 'animateColor' element

The 'animateColor' element specifies a color transformation over time.

Except for any SVG-specific rules explicitly mentioned in this specification, the normative definition for this element is the SMIL Animation [ SMILANIM] specification. In particular, see SMIL Animation: 'animateColor' element.

<!ENTITY % SVG.animateColor.extra.content "" >
<!ENTITY % SVG.animateColor.element "INCLUDE" >
<![%SVG.animateColor.element;[
<!ENTITY % SVG.animateColor.content
    "( %SVG.Description.class; %SVG.animateColor.extra.conte\
nt; )*"
>
<!ELEMENT %SVG.animateColor.qname; %SVG.animateColor\
.content; >
<!-- end of SVG.animateColor.element -->]]>
<!ENTITY % SVG.animateColor.attlist "INCLUDE" >
<![%SVG.animateColor.attlist;[
<!ATTLIST %SVG.animateColor.qname;
    %SVG.Core.attrib;
    %SVG.Conditional.attrib;
    %SVG.AnimationEvents.attrib;
    %SVG.External.attrib;
    %SVG.Animation.attrib;
    %SVG.AnimationAttribute.attrib;
    %SVG.AnimationTiming.attrib;
    %SVG.AnimationValue.attrib;
    %SVG.AnimationAddtion.attrib;
>

The from, by and to ([SMILANIM], section 4.4).

The 'from', 'by' and 'to' attributes take color values, where each color value is expressed using the following syntax (the same syntax as used in SVG's properties that can take color values):

<color> [icc-color(<name>[,<icccolorvalue>]*)]

The 'values' attribute for the 'animateColor' element consists of a semicolon-separated list of color values, with each color value expressed in the above syntax.

Out of range color values can be provided, but user agent processing will be implementation dependent. User agents should clamp color values to allow color range values as late as possible, but note that system differences might preclude consistent behavior across different systems.

The 'color-interpolation' property applies to color interpolations that result from 'animateColor' animations.

For a list of attributes and properties that can be animated using the 'animateColor' element, see Elements, attributes and properties that can be animated.

19.2.14 The 'animateTransform' element

The 'animateTransform' element animates a transformation attribute on a target element, thereby allowing animations to control translation, scaling, rotation and/or skewing.

<!ENTITY % SVG.animateTransform.extra.content "" >
<!ENTITY % SVG.animateTransform.element "INCLUDE" >
<![%SVG.animateTransform.element;[
<!ENTITY % SVG.animateTransform.content
    "( %SVG.Description.class; %SVG.animateTransform.extra.c\
ontent; )*"
>
<!ELEMENT %SVG.animateTransform.qname; %SVG.anim\
ateTransform.content; >
<!-- end of SVG.animateTransform.element -->]]>
<!ENTITY % SVG.animateTransform.attlist "INCLUDE" >
<![%SVG.animateTransform.attlist;[
<!ATTLIST %SVG.animateTransform.qname;
    %SVG.Core.attrib;
    %SVG.Conditional.attrib;
    %SVG.AnimationEvents.attrib;
    %SVG.External.attrib;
    %SVG.Animation.attrib;
    %SVG.AnimationAttribute.attrib;
    %SVG.AnimationTiming.attrib;
    %SVG.AnimationValue.attrib;
   %SVG.AnimationAddtion.attrib;
    type ( translate | scale | rotate | skewX | skewY ) 'translate'
>

The 'from', 'by' and 'to' attributes take a value expressed using the same syntax that is available for the given transformation type:

• For a type="translate", each individual value is expressed as <tx> [,<ty>].
• For a type="scale", each individual value is expressed as <sx> [,<sy>].
• For a type="rotate", each individual value is expressed as <rotate-angle> [<cx> <cy>].
• For a type="skewX" and type="skewY", each individual value is expressed as <skew-angle>.

(See The 'transform' attribute.)

The 'values' attribute for the 'animateTransform' element consists of a semicolon-separated list of values, where each individual value is expressed as described above for 'from', 'by' and 'to'.

If 'from' or 'to' attributes are not specified, the underlying value (see SMIL discussion of animation function values) is the corresponding identity transformation value. Thus, the underlying value for

• type="translate" is tx = ty = 0
• type="scale" is sx = sy = 1
• type="rotate" is rotate-angle = cx = cy = 0
• type="skewX" and type="skewY" is skew-angle = 0

Note that this results in counter-intuitive results for a to animation. Since the underlying value is identity, and the 'additive' attribute is ignored on to animations according to SMIL, such animations will behave like a non-additive from-to animation where the "from" value is identity.

If 'calcMode' has the value 'paced', then a total "distance" for each component of the transformation is calculated (e.g., for a translate operation, a total distance is calculated for both tx and ty) consisting of the sum of the absolute values of the differences between each pair of values, and the animation runs to produce a constant distance movement for each individual component.

When an animation is active, the effect of non-additive 'animateTransform' (i.e., additive="replace") is to replace the given attribute's value with the transformation defined by the 'animateTransform'. The effect of additive (i.e., additive="sum") is to post-multiply the transformation matrix corresponding to the transformation defined by this 'animateTransform'. To illustrate:

<rect transform="skewX(30)"...>
  <animateTransform attributeName="transform" attributeType="XML"
                    type="rotate" from="0" to="90" dur="5s"
                    additive="replace" fill="freeze"/>
  <animateTransform attributeName="transform" attributeType="XML"
                    type="scale" from="1" to="2" dur="5s"
                    additive="replace" fill="freeze"/>
</rect>

In the code snippet above, because the both animations have additive="replace", the first animation overrides the transformation on the rectangle itself and the second animation overrides the transformation from the first animation; therefore, at time 5 seconds, the visual result of the above two animations would be equivalent to the following static rectangle:

<rect transform="scale(2)" ... />

whereas in the following example:

<rect transform="skewX(30)"...>
  <animateTransform attributeName="transform" attributeType="XML"
                    type="rotate" from="0" to="90" dur="5s" 
                    additive="sum" fill="freeze"/>
  <animateTransform attributeName="transform" attributeType="XML"
                    type="scale" from="1" to="2" dur="5s"
                    additive="sum" fill="freeze"/>
</rect>

In this code snippet, because the both animations have additive="sum", the first animation post-multiplies its transformation to any transformations on the rectangle itself and the second animation post-multiplies its transformation to any transformation from the first animation; therefore, at time 5 seconds, the visual result of the above two animations would be equivalent to the following static rectangle:

<rect transform="skewX(30) rotate(90) scale(2)" ... />

For a list of attributes and properties that can be animated using the 'animateTransform' element, see Elements, attributes and properties that can be animated.

19.2.15 Elements, attributes and properties that can be animated

The following lists all of the elements which can be animated by an 'animateMotion' element:

• 'g'
• 'defs'
• 'use'
• 'image'
• 'switch'
• 'path'
• 'rect'
• 'circle'
• 'ellipse'
• 'line'
• 'polyline'
• 'polygon'
• 'text'
• 'clipPath'
• 'mask'
• 'a'
• 'foreignObject'

Each attribute or property within this specification indicates whether or not it can be animated by SVG's animation elements. Animatable attributes and properties are designated as follows:

Animatable: yes.

whereas attributes and properties that cannot be animated are designated:     

Animatable: no.

SVG has a defined set of basic data types for its various supported attributes and properties. For those attributes and properties that can be animated, the following table indicates which animation elements can be used to animate each of the basic data types. If a given attribute or property can take values of keywords (which are not additive) or numeric values (which are additive), then additive animations are possible if the subsequent animation uses a numeric value even if the base animation uses a keyword value; however, if the subsequent animation uses a keyword value, additive animation is not possible.

Any deviation from the above table or other special note about the animation capabilities of a particular attribute or property is included in the section of the specification where the given attribute or property is defined.

19.3 Animation using the SVG DOM

Example dom01 shows a simple animation using the DOM.

<?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="4cm" height="2cm" viewBox="0 0 400 200"
     xmlns="http://www.w3.org/2000/svg"
     onload="StartAnimation(evt)" version="1.1">
  <script type="text/ecmascript"><![CDATA[
    var timevalue = 0;
    var timer_increment = 50;
    var max_time = 5000;
    var text_element;
    function StartAnimation(evt) {
      text_element = evt.target.ownerDocument.getElementById("TextElement");
      ShowAndGrowElement();
    }
    function ShowAndGrowElement() {
      timevalue = timevalue + timer_increment;
      if (timevalue > max_time)
        return;
      // Scale the text string gradually until it is 20 times larger
      scalefactor = (timevalue * 20.) / max_time;
      text_element.setAttribute("transform", "scale(" + scalefactor + ")");
      // Make the string more opaque
      opacityfactor = timevalue / max_time;
      text_element.setAttribute("opacity", opacityfactor);
      // Call ShowAndGrowElement again <timer_increment> milliseconds later.
      setTimeout("ShowAndGrowElement()", timer_increment)
    }
    window.ShowAndGrowElement = ShowAndGrowElement
  ]]></script>
  <rect x="1" y="1" width="398" height="198"
        fill="none" stroke="blue" stroke-width="2"/>
  <g transform="translate(50,150)" fill="red" font-size="7">
    <text id="TextElement">SVG</text>
  </g>
</svg>

Example dom01

At zero seconds

At 2.5 seconds

At five seconds

View this example as SVG (SVG-enabled browsers only)

The above SVG file contains a single graphics element, a text string that says "SVG". The animation loops for 5 seconds. The text string starts out small and transparent and grows to be large and opaque. Here is an explanation of how this example works:

• The onload="StartAnimation(evt)" attribute indicates that, once the document has been fully loaded and processed, invoke ECMAScript function StartAnimation.
• The 'script' element defines the ECMAScript which makes the animation happen. The StartAnimation() function is only called once to give a value to global variable text_element and to make the initial call to ShowAndGrowElement(). ShowAndGrowElement() is called every 50 milliseconds and resets the 'transform' and 'style' attributes on the text element to new values each time it is called. At the end of ShowAndGrowElement, the function tells the ECMAScript engine to call itself again after 50 more milliseconds.
• The 'g' element shifts the coordinate system so that the origin is shifted toward the lower-left of the viewing area. It also defines the fill color and font-size to use when drawing the text string.
• The 'text' element contains the text string and is the element whose attributes get changed during the animation.

If scripts are modifying the same attributes or properties that are being animated by SVG's animation elements, the scripts modify the base value for the animation. If a base value is modified while an animation element is animating the corresponding attribute or property, the animations are required to adjust dynamically to the new base value.

If a script is modifying a property on the override style sheet at the same time that an animation element is animating that property, the result is implementation-dependent; thus, it is recommended that this be avoided.

19.4

The Animation Module defines the Animation.class content set.

The Animation Module defines the Animation.attrib, AnimationAttribute.attrib, AnimationTiming.attrib, AnimationValue.attrib and AnimationAddtion.attrib attribute sets.

19.5 DOM interfaces

The following two interfaces are from SMIL Animation. They are included here for easy reference:

DOM interfaces

Below are the DOM interfaces for the elements defined in this chapter. In addition, ElementTimeControl and TimeEvent, which are from SMIL Animation, are included here for easy reference.

19.4.1 Interface ElementTimeControl

The ElementTimeControl interface, part of the org.w3c.dom.smil module and defined in SMIL Animation: Supported interfaces, defines common methods for elements which define animation behaviors compatible with SMIL Animation.

Calling beginElement() causes the animation to begin in the same way that an animation with event-based begin timing begins. The effective begin time is the current presentation time at the time of the DOM method call. Note that beginElement() is subject to the 'restart' attribute in the same manner that event-based begin timing is. If an animation is specified to disallow restarting at a given point, beginElement() methods calls must fail. Refer also to the section Restarting animation.

Calling beginElementAt(seconds) has the same behavior as beginElement(), except that the effective begin time is offset from the current presentation time by an amount specified as a parameter. Passing a negative value for the offset causes the element to begin as for beginElement(), but has the effect that the element begins at the specified offset into its active duration. The beginElementAt() method must also respect the 'restart' attribute. The restart semantics for a beginElementAt() method call are evaluated at the time of the method call, and not at the effective begin time specified by the offset parameter.

Calling endElement() causes an animation to end the active duration, just as 'end' does. Depending upon the value of the 'fill' attribute, the animation effect may no longer be applied, or it may be frozen at the current effect. Refer also to the section Freezing animations. If an animation is not currently active (i.e. if it has not yet begun or if it is frozen), the endElement() method will fail.

Calling endElementAt() causes an animation to end the active duration, just as endElement() does, but allows the caller to specify a positive offset, to cause the element to end at a point in the future. Other than delaying when the end actually happens, the semantics are identical to those for endElement(). If endElementAt() is called more than once while an element is active, the end time specified by the last method call will determine the end behavior.

interface ElementTimeControl {
  

boolean beginElement

(

) 

raises(

DOMException

);
  boolean beginElementAt

(

in float offset

) 

raises(

DOMException

);
  boolean endElement

(

) 

raises(

DOMException

);
  boolean endElementAt

(

in float offset

) 

raises(

DOMException

);
};

Causes this element to begin the local timeline (subject to restart constraints).

No Parameters

• The element is already active and cannot be restarted when it is active. The restart attribute is set to "whenNotActive".
• The element is active or has been active and cannot be restarted. The restart attribute is set to "never".

Causes this element to begin the local timeline (subject to restart constraints), at the passed offset from the current time when the method is called. If the offset is >= 0, the semantics are equivalent to an event-base begin with the specified offset. If the offset is < 0, the semantics are equivalent to beginElement(), but the element active duration is evaluated as though the element had begun at the passed (negative) offset from the current time when the method is called.

• The element is already active and cannot be restarted when it is active. The restart attribute is set to "whenNotActive".
• The element is active or has been active and cannot be restarted. The restart attribute is set to "never".

No Parameters

• The element is not active.

Causes this element to end the local timeline at the specified offset from the current time when the method is called.

• The element is not active.

The corresponding Java binding:

package org.w3c.dom.svg;
import org.w3c.dom.DOMException;
public interface ElementTimeControl {
  boolean beginElement (  )
                  throws DOMException;
  boolean beginElementAt ( float offset )
                  throws DOMException;
  boolean endElement (  )
                  throws DOMException;
  boolean endElementAt ( float offset )
                  throws DOMException;
}

Operations:

boolean beginElement()

XXX [Description of these interface members to be filled in when merging the errata.]

Returns

XXX

Exceptions

DOMException, code XXX

XXX

boolean beginElementAt(in float offset)

XXX

Parameters

1. float offset
   XXX

Returns

XXX

Exceptions

DOMException, code XXX

XXX

boolean endElement()

XXX

Returns

XXX

Exceptions

DOMException, code XXX

XXX

boolean endElementAt(in float offset)

XXX

Parameters

1. float offset
   XXX

Returns

XXX

Exceptions

DOMException, code XXX

XXX

19.4.2 Interface TimeEvent

The TimeEvent interface, defined in SMIL Animation: Supported interfaces defined in SMIL Animation: Supported interfaces, provides specific contextual information associated with Time events.

The different types of events that can occur are:

beginEvent

This event is raised when the element local timeline begins to play. It will be raised each time the element begins the active duration (i.e. when it restarts, but not when it repeats). It may be raised both in the course of normal (i.e. scheduled or interactive) timeline play, as well as in the case that the element was begun with the beginElement() or beginElementAt() methods. Note that if an element is restarted while it is currently playing, the element will raise an end event and another begin event, as the element restarts.

• Bubbles: No
• Cancelable: No
• Context Info: None

endEvent

This event is raised at the active end of the element. Note that this event is not raised at the simple end of each repeat. This event may be raised both in the course of normal (i.e. scheduled or interactive) timeline play, as well as in the case that the element was ended with the endElement() or endElementAt() methods. Note that if an element is restarted while it is currently playing, the element will raise an end event and another begin event, as the element restarts.

• Bubbles: No
• Cancelable: No
• Context Info: None

repeatEvent

This event is raised when an element local timeline repeats. It will be raised each time the element repeats, after the first iteration.
The event provides a numerical indication of which repeat iteration is beginning. The value is a 0-based integer, but the repeat event is not raised for the first iteration and so the observed values of the detail attribute will be >= 1.

• Bubbles: No
• Cancelable: No
• Context Info: detail (current iteration)

IDL Definition

interface TimeEvent 

{

  readonly attribute 

AbstractView view;
  readonly attribute long 

detail;

  void initTimeEvent

(

in DOMString typeArg, in 

AbstractView viewArg, in long detailArg

);
};

Attributes:

view (readonly

AbstractView

)

The view attribute identifies the AbstractView [

DOM2VIEWS] from which the event was generated.

detail (readonly long

)

Specifies some detail information about the Event, depending on the type of the event. For this event type, indicates the repeat number for the animation.

Operations:

void initTimeEvent(in DOMString typeArg, in AbstractView viewArg, in long detailArg)

The initTimeEvent method is used to initialize the value of a TimeEvent created through the DocumentEvent interface. This method may only be called before the TimeEvent has been dispatched via the dispatchEvent method, though it may be called multiple times during that phase if necessary. If called multiple times, the final invocation takes precedence.

Parameters

1. DOMString typeArg
   Specifies the event type.

1. AbstractView viewArg
   Specifies the Event's AbstractView.

1. long detailArg
   Specifies the Event's detail.

No Return Value

No Exceptions

The corresponding Java binding:

package org.w3c.dom.svg;
import org.w3c.dom.events.Event;
import org.w3c.dom.views.AbstractView;
public interface TimeEvent extends 
               Event {
  public AbstractView getView( );
  public int          getDetail( );
  void initTimeEvent ( String typeArg, AbstractView viewArg, int detailArg );
}

The following interfaces are defined below: SVGAnimationElement, SVGAnimateElement, SVGSetElement, SVGAnimateMotionElement, SVGMPathElement, SVGAnimateColorElement, SVGAnimateTransformElement.

19.4.3 Interface SVGAnimationElement

The SVGAnimationElement interface is the base interface for all of the animation element interfaces: SVGAnimateElement, SVGSetElement, SVGAnimateColorElement, SVGAnimateMotionElement and SVGAnimateTransformElement.

Unlike other SVG DOM interfaces, the SVG DOM does not specify convenience DOM properties corresponding to the various language attributes on SVG's animation elements. Specification of these convenience properties in a way that will be compatible with future versions of SMIL Animation is expected in a future version of SVG. The current method for accessing and modifying the attributes on the animation elements is to use the standard getAttribute, setAttribute, getAttributeNS and setAttributeNS defined in DOM Level 2 Core [DOM2].

interface SVGAnimationElement : SVGElement,
                

SVGTests,
                                SVGExternalResourcesRequired,
                

                ElementTimeControl,

   EventTarget {

  readonly attribute SVGElement targetElement;

  float getStartTime();
  

float getCurrentTime();

  float getSimpleDuration() raises(DOMException);
};

Attributes:

targetElement (readonly SVGElement

)

The element which is being animated.

Operations:

float getStartTime()

Returns the start time in seconds for this animation.

No Parameters

Returns

The start time in seconds for this animation relative to the start time of the time container.

No Exceptions

float getCurrentTime()

Returns the current time in seconds relative to time zero for the given time container.

No Parameters

Returns

The current time in seconds relative to time zero for the given time container.

No Exceptions

float getSimpleDuration()

Returns the number of seconds for the simple duration for this animation. If the simple duration is undefined (e.g., the end time is indefinite), then an exception is raised.

No Parameters

Returns

number of seconds for the simple duration for this animation.

Exceptions

DOMException, code NOT_SUPPORTED_ERR

The simple duration is not determined on the given element.

19.4.4 Interface SVGAnimateElement

The SVGAnimateElement interface corresponds to the 'animate' element.

Object-oriented access to the attributes of the 'animate' element via the SVG DOM is not available.

interface SVGAnimateElement : SVGAnimationElement {
};

19.4.5 Interface SVGSetElement

The SVGSetElement interface corresponds to the 'set' element.

Object-oriented access to the attributes of the 'set' element via the SVG DOM is not available.

interface SVGSetElement : SVGAnimationElement {
};

19.4.6 Interface SVGAnimateMotionElement

The SVGAnimateMotionElement interface corresponds to the 'animateMotion' element.

Object-oriented access to the attributes of the 'animateMotion' element via the SVG DOM is not available.

interface SVGAnimateMotionElement : SVGAnimationElement {
};

19.4.7 Interface SVGMPathElement

The SVGMPathElement interface corresponds to the 'mpath' element.

interface SVGMPathElement : SVGElement,
                

            SVGURIReference,
    

                        SVGExternalResourcesRequired {
};

19.4.8 Interface SVGAnimateColorElement

The SVGAnimateColorElement interface corresponds to the 'animateColor' element.

Object-oriented access to the attributes of the 'animateColor' element via the SVG DOM is not available.

interface SVGAnimateColorElement : SVGAnimationElement {
};

19.4.9 Interface SVGAnimateTransformElement

The SVGAnimateTransformElement interface corresponds to the 'animateTransform' element.

Object-oriented access to the attributes of the 'animateTransform' element via the SVG DOM is not available.

interface SVGAnimateTransformElement : SVGAnimationElement {

};