# SVG UI Curved animation

**URL:** <https://discourse.nodered.org/t/svg-ui-curved-animation/79493>\
**Category:** Dashboard\
**Created:** [29 June 2023 20:29 UTC](https://discourse.nodered.org/t/svg-ui-curved-animation/79493 "2023-06-29T20:29:30Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![thalesmaoa](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/thalesmaoa/32/17067_2.png) [@thalesmaoa](https://discourse.nodered.org/u/thalesmaoa)\
**Post date:** [29 June 2023 20:29 UTC](https://discourse.nodered.org/t/svg-ui-curved-animation/79493/1 "2023-06-29T20:29:30Z")

</div>

Hi there, I'm using the transform animation from SVG-ui node to make some objects move linearly. Everything works great. However, now I need to make a curved animation. I know that there is a property for SVG of motion animation, in which the object follows a path. Is there a way to perform a curved animation in SVG UI?

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [2 July 2023 20:13 UTC](https://discourse.nodered.org/t/svg-ui-curved-animation/79493/2 "2023-07-02T20:13:06Z")

</div>

HI @thalesmaoa,

Currently the _"Animation"_ tabsheet of the ui-svg node does _ **not** _ support curved animations.

Of course you can always add animations yourself to the svg, in this case an `animateMotion` animation element (see example [here](https://developer.mozilla.org/en-US/docs/Web/SVG/Element/animateMotion)). The disadvantage - compared to the _"Animation"_ tabsheet, is that you can only edit your drawing with an external svg editor that supports animations. I have never looked at that, so I cannot give any advice about this.

Bart

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [1 August 2023 20:13 UTC](https://discourse.nodered.org/t/svg-ui-curved-animation/79493/3 "2023-08-01T20:13:38Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.
