Reset camera using OrbitControls.js

Question

I\'m using OrbitControls.js to allow mouse interaction. I\'m adding a button into the scene that allows to \"reset\" the camera to it\'s state where it was before any mouse

Answer 1

ah.adel is correct Pan operation will update the center of the camera controller. Therefore if you need to reset/restore the camera to a predefined camera, you need to set camera controller center also.

Following code is a simple code to store camera position, rotation and control center

var camToSave = {};
camToSave.position = camera.position.clone();
camToSave.rotation = camera.rotation.clone();
camToSave.controlCenter = controls.center.clone();

Use this function to restore camera later.

function restoreCamera(position, rotation, controlCenter){
    camera.position.set(position.x, position.y, position.z);
    camera.rotation.set(rotation.x, rotation.y, rotation.z);

    controls.center.set(controlCenter.x, controlCenter.y, controlCenter.z);
    controls.update();

    render();
}

Call restoreCamera function to restore saved camera.

restoreCamera(camToSave.position, camToSave.rotation, camToSave.controlCenter);

Hope this will help to anyone who having this problem