Project 12: Orbit Controls Viewer

3D Engineer

Builds on these lessons

Step 1 of 2

Project

Letting Users Orbit

drei's OrbitControls lets the viewer drag to rotate and scroll to zoom, without writing any mouse-event code yourself.

🎯 Your Task

Please add the exact code shown in the light gray box below to your editor.Do not delete your previous code, just insert these new lines in the correct place!

export default function Scene() {
  return (
    <Canvas>
      <ambientLight intensity={0.7} />
      <mesh>
        <torusKnotGeometry args={[0.7, 0.25, 100, 16]} />
        <meshStandardMaterial color="mediumpurple" />
      </mesh>
      <OrbitControls />
    </Canvas>
  );
}

← Previous Next →