How to set up Three JS Orbit Controls?

edit

To set up Three JS Orbit Controls, you need to follow these steps:

1. First, you need to include the Orbit Controls script file in your HTML file.

<script src="https://unpkg.com/three-orbit-controls"></script>

1. Next, create an instance of THREE.OrbitControls and pass in the camera and renderer as arguments.

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

1. Then, set the controls.autoRotate property to true if you want the camera to rotate automatically.

controls.autoRotate = true;

1. Finally, add an event listener to the window object to update the controls on window resize.

window.addEventListener( 'resize', function () {
  camera.aspect = window.innerWidth / window.innerHeight;
  camera.updateProjectionMatrix();
  renderer.setSize( window.innerWidth, window.innerHeight );
  controls.update();
}, false );

With these steps, you should be able to successfully set up Three JS Orbit Controls.