Remove Easing from animation after first animation loop


I’m new to Babylonjs and I’m playing around with some code. I’m trying to figure out how easing in animations work but I’m having a small problem.

I have a sphere that I am rotating around its own axis, I want to be able to ease into the animation when the animation starts, and then continue rotation the sphere indefinitely without any change in speed.
I’ve placed an easing function with the EASEIN mode on the animation, but I can’t figure out how to remove that easing once the animation has started. Now the animation eases in on every single loop.

I’ve made a small playground to show the problem: Babylon.js Playground

Thanks in advance.

Hey and welcome :slight_smile:

I would recommend to do that in two steps. First animation (no loop) with easing and onAnimationEnd start the second one (with loop and easing)

Hey @Deltakosh,

Thanks for the tip.

Am I to understand that an easing function can’t be unset once it’s applied to an animation?

I rewrote the example a bit:
It seems to work but now it looks like the speed is a bit off when transitioning from the first animation into the next.

What you see is the transition from a cubic acceleration into a fixed speed.

This is the expected behavior (based on your code :))

Maybe a Bezier easing will be better so you can control the acceleration at the end to smoothly transition?

Hi @Deltakosh,

I’ve tried it and it works a bit better…

I’ll be experimenting a bit more.
Thank you for your help.

1 Like