Prevent Excessive Spinning When Animating ArcRotateCamera

Hello Everyone,

I have a scene that loads with an ArcRotateCamera that can only orbit or spin on the camera.alpha axis. I have a GUI elements in the scene, when the user clicks it, the camera animates to a profile view of the mesh in the scene. The issue I’m having is if the user orbits several times around the mesh and then clicks the button for the camera animation, the camera spins excessively during the animation, basically unwinding the orbits the user performed.

What is a proper solution to animate the camera smoothly from it’s current position to the end animation position? Some things I have tried are testing different ease functions, clamping the camera.alpha degrees to 360 in order to prevent heavy spinning, and changing the camera to a freeCamera when the GUI is clicked.

Here is a playground of my scene:

And here is the actual project I’m working on:
https://david-eustice.com/pilot_plant/index.html

Thank you kindly, I appreciate your input.

-Dave E.

The animation seems ok to me.

The alpha value is animated from 3.101 to 6.297, so the camera is doing a half-turn around the mesh.

In your live link, you should check the “from” and “to” values you use for the animation, they may not be what you think they are.

If the user spins around the scene a lot (lets say 6 times) and then clicks the GUI bitton to play the animation, the camera.aplha will spin until it reaches the end animation camera.aplha value.
Is there a better way to do this? I’d like it if the camera would go straight from it current position to the side profile view but I am not sure that’s possible with the arcRotateCamera. I was thinking if I could change the camera.aplha from radian to degrees and clamp the value so once it camera orbit completes 360 degrees, it starts over again at 0 degrees. This might at least minimize the spinning when the animation plays.

You should normalize the values between 0 and 2*PI before doing the animation:

4 Likes

I also use what

    camera.alpha = camera.alpha % (Math.PI*2);
    if (camera.alpha < 0) camera.alpha += Math.PI*2;

did to solve the same problem
Like Evgeni_Popov’s in PG code
I haven’t found anything more elegant than this.

2 Likes

Thank you @Evgeni_Popov and @11128 this works beautifully.
I appreciate you taking the time to help me with the solution.