Как задать stroke-dasharray/offset - для сложных svg-элементов?

Question

Как задать stroke-dasharray/offset - для сложных svg-элементов?

Союз Здравых Сил Профи (510), открыт 1 неделю назад

Хочу сделать анимацию - есть кнопка, по бокам от неё стрелки, которые изначально скрыты. При наведении на кнопку, стрелки красиво отрисовываются через stroke-dash-array/offset(юзаю Gsap)
Но почему-то эти свойства НИКАК не влияют на мои стрелки, совсем

Я почитал про это, и как я понял, если структура svg-элемента сложная, то такие свойства для него не будут работать. А для простых circle/line/polyline и тд - работать будет

Можно это как то обойти и задать эти свойства для более сложных элементов?
Ссылка на анимацию со стрелками: https://codepen.io/Vegan-AK/pen/MWdgabP
*пока сделал анимашку через scale, но выглядит так себе, через svg-свойства красивее

Answer 1

А что сделать надо?
Как анимация должна проявится?

dasharray и dashoffset это проявление границ фигуры но не самой фигуры...

Answer 2

Горький Опыт Профи (800) 1 неделю назад

Под более сложным элементов ты, наверное, имеешь в виду path.
Почитай СТАТЬЮ - в ней разбирается анимация stroke-dasharray/offset...

Союз Здравых СилПрофи (510) 1 неделю назад

статья новая конечно) я знаю как они работают, как их запускать для анимаций и тд, проблема в том что вот у меня есть стрелки - и для них эти свойства не работают, они их никак не меняют
и я не знаю как всё таки их задать этим стрелкам

Резидент Казахстана Оракул (68271) Союз Здравых Сил, у вас там объемная фигура...что бы заработало в вашем случае то стрелка должна быть нарисовано одним штрихом...что бы не было объёма...