I’ve been trying to extend the navigation features of my app to switch between standard OrbitControls to a constrained mode where the camera target moves, but the camera position remains. I am trying to switch to a camera control similar to how it works in the various examples with equirectangular maps: https://threejs.org/examples/?q=equirectangular#webgl_panorama_equirectangular.
For some reason, I’ve not been able to match up the camera rotations. Here is a codepen which demonstrates my issue: https://codepen.io/fraguada/pen/KEXzrE. Click on the button to toggle between modes.
You should be able to open up the console and type
toggleWaypoint() to switch between modes.
My intuition tells me I need to calculate the ‘latitude’ and ‘longitude’ from the camera’s rotation used in OrbitControls. What I’d like is to be able to switch between navigation modes seamlessly, without any views jumping suddenly.
My workaround is here: https://codepen.io/fraguada/pen/EMwMrX (although I’m still on r85, and it seems the controls are working differently in the latest).
The fix was to essentially still use OrbitControls, albeit in a more constrained manner, as in this example: https://threejs.org/examples/?q=pano#webgl_panorama_cube. In the example (and a hint from SO), the camera is very close to the origin, and panning is disabled. In my example, I might have views in many places, so I needed to create a pivot point to act as the origin of the camera position. I add an
Object3D pivot and add the camera as a child to this, then I create another OrbitControls object with this new camera. Based on the navigation mode, I render one of the two cameras.
This was actually way easier than I made it out to be. After trying to integrate the workaround in my app (which is unnecessarily complicated and in bad need of a rewrite) I remembered that OrbitControls had a target. Instead of messing with the Object3D pivot parenting mess, just change the OrbitControls Target! A complete moment. https://codepen.io/fraguada/pen/wOjKEq