#Manually update orbitcontrols' camera?

6 messages · Page 1 of 1 (latest)

keen gust
#

Hi everyone, so I'm trying to make a carousel of cars and I'm working on the fact that when the user lets go of the controls, the rotation continues until the camera is perfectly in front of a car.

To achieve this, I'm calculating an angle using the position of the nearest car in relation to the camera's position. I then try to manually rotate controls' ref to move camera.

    if (closestCarIndex !== -1 && carRefs.current[closestCarIndex]) {
        const carPosition = carRefs.current[closestCarIndex]!.position;
        const deltaX = camera.position.x - carPosition.x;
        const deltaZ = camera.position.z - carPosition.z;
        const angle = Math.atan2(deltaZ, deltaX);
        
        const eulerRotation = new THREE.Euler(0, angle, 0);

        if (controlsRef.current) {
         // trying to update rotation manually
            controlsRef.current.object.rotation(eulerRotation);
        }
     
    }

Anyone know if i'm on the wrong path for this ? Is there a better way to achieve it ?
Thanks a lot

vagrant junco
#

Use <CameraControls /> from drei

keen gust
#

I managed to update position with camera from useThree()

#

Is that good too ?

#

camera.position.set(x, y, z)

vagrant junco
#

That’s fine too. CameraControls jsut makes it easier to move the animate the camera around