Three.js · 5 / 6

Dashboard
Module 5 · OrbitControls

Explore the scene interactively

The official OrbitControls (from three/examples/jsm) rotates the camera around a target — drag to orbit, pinch/scroll to zoom (behavior varies by browser). Always enable damping for smoother motion and call controls.update() each frame after changing the camera.

Interact inside the demo iframe below — drag on desktop or one-finger drag on touch devices.

import { OrbitControls } from 'three/addons/controls/OrbitControls.js';

const controls = new OrbitControls(camera, renderer.domElement);
controls.enableDamping = true;
controls.dampingFactor = 0.06;

function animate() {
  requestAnimationFrame(animate);
  controls.update();
  renderer.render(scene, camera);
}
Pro tip

Set minDistance / maxDistance so users cannot zoom through the floor.

Next

Module 6 scales up with InstancedMesh — thousands of meshes, one draw pattern.