Hi there!
I am trying to animate a SVG mind map. The SVG contains a lot of layers and groups. I was trying to achieve an ordered structure using the same classes for multiple objects and by using a loop. I've simplified the graphic for you guys and created a CodePen below.
My issue now is that I don't know how to achieve this: I want to have a staggered animation of the category items but it should animate in this order: Cat Item 1 arrow animation, Cat Item 1 text animation, Cat Item 2 arrow animation, Cat Item 2 text animation, Cat Item 3 arrow animation, Cat Item 3 text animation, etc.
Do I need nested timelines for this? I'm not a developer so I think this is beyond my skills. Any help would be appreciated!