# animationGroup play backwards issue

**URL:** <https://forum.babylonjs.com/t/animationgroup-play-backwards-issue/47502>\
**Category:** Bugs\
**Created:** [January 24, 2024, 8:31pm UTC](https://forum.babylonjs.com/t/animationgroup-play-backwards-issue/47502 "2024-01-24T20:31:17Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![N\_Nada](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/n_nada/32/37421_2.png) [@N\_Nada](https://forum.babylonjs.com/u/N_Nada)\
**Post date:** [January 24, 2024, 8:31pm UTC](https://forum.babylonjs.com/t/animationgroup-play-backwards-issue/47502/1 "2024-01-24T20:31:17Z")

</div>

Hello  
I would like to run an animationGroup forward and backward. If I understand it correctly, I can use speedRatio for that. Here is an example: [https://playground.babylonjs.com/#CBGEQX#1779](https://playground.babylonjs.com/#CBGEQX#1779)  
If I press Play, the animation runs once till the end as expected .  
If I press Reverse, the animation runs backwards as expected to Frame zero.  
But if I press Pause during a running animation, and then press Reverse, then the animation starts looping.  
There seems to have been a similar problem here (October 2019), which was then supposedly fixed.  
[speedRatio effect in animation? - #6 by Deltakosh](https://forum.babylonjs.com/t/speedratio-effect-in-animation/6564/6)  
Is it still a bug or is it meant to be?

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [January 24, 2024, 11:23pm UTC](https://forum.babylonjs.com/t/animationgroup-play-backwards-issue/47502/2 "2024-01-24T23:23:43Z")

</div>

Assigned @Evgeni\_Popov on January 24, 2024, 11:23pm UTC



---

<div class="post-metadata">

**Author:** ![11128](https://avatars.discourse-cdn.com/v4/letter/1/d07c76/32.png) [@11128](https://forum.babylonjs.com/u/11128)\
**Post date:** [January 25, 2024, 8:05am UTC](https://forum.babylonjs.com/t/animationgroup-play-backwards-issue/47502/3 "2024-01-25T08:05:58Z")

</div>

`pause() <-> play()`  
I can’t seem to find a way to resolve the animation’s From-To relationship in this relationship.

From the first execution point **animationGroup.play**  
from ~ to will have an initial value ex) 0~100

Since the value of pause() does not change, it stops maintaining the previous value.

If you do changing `speedRatio = -1;` Its `from to` will not change  
For example, if you press reverse about 60 frames after starting,  
The frame rate will continue to decrease from 60 and will never reach the target of 100.

Also, the value of the` from to` is not processed.

What I found out about the next PG is that if the value for the range of `from to` is exceeded, the frame is repeated.  
**frame**  
100 → 0 → 100 -\>0  
or  
0 → 100 → 0 → 100

> **[Babylon.js Playground](https://playground.babylonjs.com/#CBGEQX%231784)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

`stop() <-> start()`  
In this relationship, it is possible for it to work even if you reverse it after the animation is completely finished.

If you don’t have logic that needs to be processed only with play pause, you can do it with this way

This way is just by adjusting from to frame without changing the speedRatio value

---

<div class="post-metadata">

**Author:** ![11128](https://avatars.discourse-cdn.com/v4/letter/1/d07c76/32.png) [@11128](https://forum.babylonjs.com/u/11128)\
**Post date:** [January 25, 2024, 8:13am UTC](https://forum.babylonjs.com/t/animationgroup-play-backwards-issue/47502/4 "2024-01-25T08:13:05Z")

</div>

`stop() <-> start()` **PG**

> **[Babylon.js Playground](https://playground.babylonjs.com/#CBGEQX%231785)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [January 25, 2024, 2:32pm UTC](https://forum.babylonjs.com/t/animationgroup-play-backwards-issue/47502/5 "2024-01-25T14:32:25Z")

</div>

As explained by @11128, the way to handle this is to use start/stop. However, you should save the current frame when hitting “pause”, so that you can restart from the right frame afterwards:

> **[Babylon.js Playground](https://playground.babylonjs.com/#CBGEQX%231786)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

See also:

> [@Gltf Animation loops when i click, how to stop the loop](https://forum.babylonjs.com/t/gltf-animation-loops-when-i-click-how-to-stop-the-loop/38477/6):
>
> I found a way to make it work: Just stopping the animation and setting the speed ratio was not working (at least for me), the animation was restarting from frame 0 and not from the current frame. I needed to get the current frame and play the animation from this frame to the from or to frame value, depending on the direction of the animation. @Cie You can check animation.isStarted to know if the animation is still playing or not to disable mouse clicks.

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [January 25, 2024, 2:32pm UTC](https://forum.babylonjs.com/t/animationgroup-play-backwards-issue/47502/6 "2024-01-25T14:32:30Z")

</div>

Unassigned @Evgeni\_Popov on January 25, 2024, 2:32pm UTC



---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [January 25, 2024, 4:00pm UTC](https://forum.babylonjs.com/t/animationgroup-play-backwards-issue/47502/7 "2024-01-25T16:00:55Z")

</div>

Ok, I was able to fix it in the `runtimeAnimation` class, so after this PR is merged, your first PG will work as expected, as well as [https://forum.babylonjs.com/t/gltf-animation-loops-when-i-click-how-to-stop-the-loop/38477:](https://forum.babylonjs.com/t/gltf-animation-loops-when-i-click-how-to-stop-the-loop/38477:)

> <https://github.com/BabylonJS/Babylon.js/pull/14740>
>
> See https://forum.babylonjs.com/t/animationgroup-play-backwards-issue/47502/5 an…d https://forum.babylonjs.com/t/gltf-animation-loops-when-i-click-how-to-stop-the-loop/38477.

---

<div class="post-metadata">

**Author:** ![N\_Nada](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/n_nada/32/37421_2.png) [@N\_Nada](https://forum.babylonjs.com/u/N_Nada)\
**Post date:** [January 25, 2024, 4:24pm UTC](https://forum.babylonjs.com/t/animationgroup-play-backwards-issue/47502/8 "2024-01-25T16:24:48Z")

</div>

Thank you, that sounds great.
