Search code examples
animationsvgsvg-animate

Multiple animations on SVG element

If I have single SVG element and multiple animation elements related to it which animation will execute first and take effect over the SVG?

Example code : 

<svg ...... >
    <animation id="1" .... />
    <animation id="2" .... />
    <animation id="3" .... />
</svg>

And is there any difference if the animations are from different type - animateTransform, animateColor, animate, animatePath ?

Thank you in advance

Solution

  • All of them will activate according to their individual conditions. None of them will be "first", they all get processed in a single pass.