W3C home > Mailing lists > Public > www-svg@w3.org > December 2010

SVG animateMotion specification clarification request

From: Shane Stephens <shans@google.com>
Date: Mon, 20 Dec 2010 15:59:38 +1100
Message-ID: <AANLkTik7x2itG34Q5+mcYT_jtDnAg0PQrXuRm0LeEggp@mail.gmail.com>
To: www-svg@w3.org
Hi list,

I'm trying to work out the correct behaviour for the <animateMotion>
element as relates to other transforms on the same target element.
The specification is not 100% clear about the correct behaviour, and
if my reading is correct then at least one of the SVG Test files
(http://www.w3.org/Graphics/SVG/Test/20061213/htmlEmbedHarness/full-animate-elem-24-t.html)
is incorrect.

Here's the relevant part of the specification:

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

It's clear that the transformation matrix generated by animateMotion
elements (the supplemental transformation) is intended to be
independent of that generated by animateTransform elements and
'transform' attributes in the target element (the CTM).  The question
I have is whether the supplemental transformation is post-multiplied
onto the CTM or pre-multiplied.

The relevant wording is "The supplemental transformation is applied on
top of [the CTM]".  Unfortunately this isn't clear - elsewhere in the
specification there is a sense of postMultiply == concatenate ==
"applied after", but not "on top of".

The following example illustrates (I think) that the correct approach
is to postMultiply the supplemental transform:

<g transform="translate(300, 30)">
  <rect width="40" height="40" fill="green"></rect>
  <animateMotion dur="1s" repeatCount="1" rotate="auto" path="M
100,250 C 100,50 400,50 400,250"></animateMotion>
</g>

If we were to preMultiply the supplementalTransform, then the observed
path of the green rectangle varies wildly depending on whether
rotate="auto" is specified or not - with rotate="auto", the rectangle
appears to move along a path starting above the screen and rotating in
roughly a semicircle moving predominantly downwards, as the
supplementalTransform rotates as well as translates, and the rotation
in turn effects the translation component of the CTM.  On the other
hand, if the rotate attribute is not set to "auto", there is no
rotation component to the supplementalTransform and the rectangle
appears to move along a path starting at 400,280 (300,30 + 100,250)
and moving in roughly a semicircle moving predominantly to the right.

On the other hand, if we postMultiply the supplementalTransform then
the green rectangle always moves on the path starting at 400,280 and
moving to the right.  If rotate="auto" is set, then the rectangle
rotates as it moves along the path, which I think is more in keeping
with the intention of this attribute.

However, postMultiplying the supplementalTransform causes
animate-elem-24-t to render incorrectly.  The relevant part of this
file is:

<text id="TextElement" x="0" y="0" font-family="MyFont" font-size="20"
fill="#f22" transform="rotate(-30)">It's alive!
  <animateMotion path="M 0 0 L 50 180" begin="3s" dur="6s" fill="freeze"/>
  <animateTransform attributeName="transform" attributeType="XML"
type="rotate" from="-30" to="0" begin="3s" dur="6s" fill="freeze"/>
  <animateTransform attributeName="transform" attributeType="XML"
type="scale" from="1" to="3" additive="sum" begin="3s" dur="6s"
fill="freeze"/>
</text>

In this case, postMultiplying the supplementalTransform causes the
rotate and scale components of the CTM generated from the
animateTransform elements to effect the size of the translation
generated by the animateMotion - and this is clearly not expected by
the author of the test as the indicated expected positions of the text
at various times no long match the actual positions of the text.

So which is correct?

Cheers,
    -Shane
Received on Monday, 20 December 2010 05:00:09 GMT

This archive was generated by hypermail 2.3.1 : Friday, 8 March 2013 15:54:47 GMT