Switch controllers

[Francesco_Iafulli]

Hi everyone,
I’m trying to make a veriagated navigation system of a 3d space using multiple controllers. For now I’m focused on orbitcontrollers and flycontrollers. And already the problems begin. I activate the orbitcontroller and navigate the scene a bit, then switch to the flycontroller and everything is fine, then navigate via the flycontroller exactly where I left off with the orbit, but when I switch back from the flycontroller to the orbitcontroller, the camera jumps into a different position/orientation (orbit → fly = perfect; fly → orbit = jumps). Is there a way to switch seamlessly from the flycontroller to the orbitcontroller ?

[PavelBoytchev]

Try this: before switching to OrbitControls dispose it, recreate it and switch to the new instance. This is not an elegant approach, but if this works (I’ve never tried it), you will have some basic solution until you find a better solution.

There was a long discussion here about the problems of switching from one controls to another:

Restore camera properties irrespective of controls

As of now, the ThreeJS library provides the ability to use one of its 8 control “addons” (Arcball, Drag, FirstPerson, Fly, Orbit, PointerLock, Trackball and Transform). In my project, I allow the user to choose one of these to handle stuff in the scene, by disposing the “old” control and recreating the “new” one. As a side note, some time ago, one of the ThreeJS developers recommended that I should use the .enabled property of the control instead of my disposing + recreation system, but of cours…

[Fennec]

Not sure, but updating the camera with the FlyControls is technically a manual change, so maybe you need to call controls.update() before switching to OrbitControls.

From the official Code Example:

//controls.update() must be called after any manual changes to the camera's transform
camera.position.set( 0, 20, 100 );
controls.update();

[Yin_Cognyto]

@Francesco_Iafulli

And already the problems begin. I activate the orbitcontroller and navigate the scene a bit, then switch to the flycontroller and everything is fine, then navigate via the flycontroller exactly where I left off with the orbit, but when I switch back from the flycontroller to the orbitcontroller, the camera jumps into a different position/orientation (orbit → fly = perfect; fly → orbit = jumps). Is there a way to switch seamlessly from the flycontroller to the orbitcontroller ?

Like @PavelBoytchev pointed out, this is possible. I did this by disposing the “old” control and create the “new” one in a similar project I built, because at that time, not all controls had the .enabled property (it’s the same now, albeit FlyControls appears to have been provided with such a property in the meantime).

The working example from the solution in the linked discussion has only 3 controls covered when it comes to switching, up to you to do the rest. What I can say for sure is that it works (there were no MapControls when I finished my project using this), but unfortunately, things are not that simple as @Fennec indicated. In some cases - which you already noticed - adjusting the camera is required as well.

In case it helps to prove that the approach works for all controls back then, here is my released project. It’s a bit different from the usual ones in that it’s intended to run in a local 3rd party software environment on the user’s screen, but the localhost HTML page itself works in a browser too.

[Fennec]

Here is my attempt so far:

Edit fiddle - JSFiddle - Code Playground

The problem is with the Orbit target, the camera position is right and the lookAt too, but defining a new target to rotate/orbit around is not as intuitive.