Orbitcontrols - how to load last view position and rotation

Question

how would I be able to save and load the last view position and rotation when using the orbitalcontrols? When my 3D page is refreshed, I want to load the page at the last view instead of going back to the default position, zoom, and rotation. I am using three.js version 71. Thanks,

Jim

Answer 1

const loadControls = (controls) => {
  const stateJSON = localStorage.getItem(`orbitControls`);

  if (stateJSON) {
    const { target0, position0, zoom0 } = JSON.parse(stateJSON);
    controls.target0.copy(target0);
    controls.position0.copy(position0);
    controls.zoom0 = zoom0;
    controls.reset();
  }
};

const saveControls = (controls) => {
  controls.saveState();
  const { target0, position0, zoom0 } = controls;
  const state = { target0, position0, zoom0 };
  localStorage.setItem(`orbitControls`, JSON.stringify(state));
};

const controls = new OrbitControls(camera, renderer.domElement);

document.addEventListener(`visibilitychange`, () => {
  saveControls(controls);
});