Chaining two <animateTransform>s using SMIL

Question

I'm trying to have two animations in my SVG run one after another.

This is the way they have been written in. They are written into a group with a few primitives inside. I'm trying to make the whole group rotate and then translate.

However when I run this, the transform seems to reset at the end of the first animation

    <animateTransform attributeName="transform"
                      id="anim1" 
                      type="rotate"
                      from="0 72 72"
                      to="40 72 72"
                      begin="0s; anim2.end"
                      dur="1s"
                      fill="freeze" repeatCount="1" />
    <animateTransform attributeName="transform"
                      id="anim2"
                      type="translate"
                      from="0 0"
                      to="10 0"
                       begin="anim1.end" dur="0.4s" fill="freeze"/>

Answer 1

Define additive="sum" to apply one transformation on top of the other.

So if you want to start the second animation from the end point of the first, add the attribute to the second animation. The way the animations are chained, then the first animation will start again. If you want it to restart from the final position of the second animation, add the attribute also to the first animation.