animate module

Because the Web is a dynamic medium, SVG supports the ability to change vector graphics over time.

Set

class svgwrite.animate.Set(href=None, **extra)

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.

Methods

Set.__init__(href=None, **extra)

Set constructor.

Parameters:href – target svg element, if href is not None; else the target SVG Element is the parent SVG Element.
Animate.set_href(element)
Parameters:element – set target svg element to element
Animate.set_target(attributeName, attributeType=None)

Set animation attributes attributeName and attributeType.

Animate.set_event(onbegin=None, onend=None, onrepeat=None, onload=None)

Set animation attributes onbegin, onend, onrepeat and onload.

Animate.set_timing(begin=None, end=None, dur=None, min=None, max=None, restart=None, repeatCount=None, repeatDur=None)

Set animation attributes begin, end, dur, min, max, restart, repeatCount and repeatDur.

Animate.freeze()

Freeze the animation effect. (see also fill)

SVG Animation Attributes

SVG Attributes

  • externalResourcesRequiredbool

    False: if document rendering can proceed even if external resources are unavailable else: True

  • to<value> Specifies the value for the attribute during the duration of the set element. The argument value must match the attribute type.

AnimateMotion

class svgwrite.animate.AnimateMotion(path=None, href=None, **extra)

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

Methods

AnimateMotion.__init__(path=None, href=None, **extra)
Parameters:
  • path – the motion path
  • href – target svg element, if href is not None; else the target SVG Element is the parent SVG Element.
AnimateMotion.set_value(path=None, calcMode=None, keyPoints=None, rotate=None)

Set animation attributes path, calcMode, keyPoints and rotate.

SVG Animation Attributes

SVG Attributes

  • externalResourcesRequiredbool

    False: if document rendering can proceed even if external resources are unavailable else: True

  • calcMode'discrete | linear | paced | spline'

    Specifies the interpolation mode for the animation.

  • path<path-data>path parameter

    The motion path, expressed in the same format and interpreted the same way as the d attribute on the Path element. The effect of a motion path animation is to add 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 computed X and Y values computed over time.

  • keyPoints<list-of-numbers>

    keyPoints takes a semicolon-separated list of floating point values between 0 and 1 and indicates how far along the motion path the object shall move at the moment in time specified by corresponding keyTimes value. Distance calculations use the user agent’s distance along the path algorithm. Each progress value in the list corresponds to a value in the keyTimes attribute list.

    If a list of keyPoints is specified, there must be exactly as many values in the keyPoints list as in the keyTimes list.

    If there are any errors in the keyPoints specification (bad values, too many or too few values), then the document is in error.

  • rotate<number> | 'auto' | 'auto-reverse'

    The rotate attribute post-multiplies a supplemental transformation matrix onto the CTM of the target element to apply a rotation transformation about the origin of the current user coordinate system. The rotation transformation is applied after the supplemental translation transformation that is computed due to the path attribute.

    • 'auto'

      Indicates that the object is rotated over time by the angle of the direction (i.e., directional tangent vector) of the motion path.

    • 'auto-reverse'

      Indicates that the object is rotated over time by the angle of the direction (i.e., directional tangent vector) of the motion path plus 180 degrees.

    • <number>

      Indicates that the target element has a constant rotation transformation applied to it, where the rotation angle is the specified number of degrees.

      Default value is '0'.

  • origin'default'

    The origin attribute is defined in the SMIL Animation specification

Animate

class svgwrite.animate.Animate(attributeName=None, values=None, href=None, **extra)

The animate element allows scalar attributes and properties to be assigned different values over time .

Methods

Animate.__init__(attributeName=None, values=None, href=None, **extra)
Parameters:
  • attributeName – name of the SVG Attribute to animate
  • values – interpolation values, string as <semicolon-list> or a python list
  • href – target svg element, if href is not None; else the target SVG Element is the parent SVG Element.
Animate.set_value(values, calcMode=None, keyTimes=None, keySplines=None, from_=None, to=None, by=None)

Set animation attributes values, calcMode, keyTimes, keySplines, from, to and by.

SVG Animation Attributes

SVG Attributes

  • externalResourcesRequiredbool

    False: if document rendering can proceed even if external resources are unavailable else: True

AnimateColor

class svgwrite.animate.AnimateColor(attributeName=None, values=None, href=None, **extra)

The animateColor element specifies a color transformation over time.

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> <icccolor>?

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.

SVG Animation Attributes

AnimateTransform

class svgwrite.animate.AnimateTransform(transform, element=None, **extra)

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

Methods

AnimateTransform.__init__(transform, element=None, **extra)
Parameters:
  • element – target svg element, if element is not None; else the target svg element is the parent svg element.
  • transform (string) – 'translate | scale | rotate | skewX | skewY'

SVG Animation Attributes

SVG Attributes

  • externalResourcesRequiredbool

    False: if document rendering can proceed even if external resources are unavailable else: True

  • type'translate | scale | rotate | skewX | skewY'

    Indicates the type of transformation which is to have its values change over time. If the attribute is not specified, then the effect is as if a value of translate were specified.

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>.