Как анимировать svg элементы один за другим?

Question

[cester]

Добрый день! Подскажите пожалуйста как лучше анимировать появление svg элементов и равномерно их разместить в процентном соотношении?
Нужно как-то показать их друг за другом.

такой код

Answer 1

[Максим]

https://codepen.io/topicstarter/pen/WmMwMp - вариант ?

Answer 2

[RAX7]

Еще вариант
*не работает в ie/edge

равномерно их разместить в процентном соотношении

убери viewBox, замени rect на line и задавай координаты в процентах

Comments

[Максим]

smil - классика ....!

Answer 3

[Владимир]

Вариант номер 1
https://developer.mozilla.org/ru/docs/Web/CSS/anim...
вариант номер 2
https://developer.mozilla.org/en-US/docs/Web/API/W...

https://css-tricks.com/animating-svg-css/

Comments

[cester]

а их разместить в процентном соотношении?