How can I smoothly switch between two different cameras in Three.js while transitioning from one to the other?
Imagine a scene with a rock and a tree, each having its own dedicated camera setup. I'm looking for a way to seamlessly transition between these two cameras.
Note: My configuration includes two cameras sharing one viewport.
For example:
// Rock camera
const rockCamera = new THREE.PerspectiveCamera(75, sizes.width/sizes.height, 0.1, 1000);
rockCamera.rotation.x = THREE.MathUtils.degToRad(-50);
rockCamera.position.set(2, 13, 8,);
scene.add(rockCamera);
// Tree camera
const treeCamera = new THREE.PerspectiveCamera(75, sizes.width/sizes.height, 0.1, 1000);
treeCamera.rotation.x = THREE.MathUtils.degToRad(25);
treeCamera.position.set(7, 5, 12,);
scene.add(treeCamera);