Orbit Controls

Click and drag to orbit, scroll to zoom.

import * as EASEL from "easel";

const camera = new EASEL.PerspectiveCamera({
  fov: 45,
  aspect: width / height,
});
camera.position.set(4, 3, 6);

const renderer = new EASEL.Renderer({ canvas, width, height });

// OrbitControls: drag to rotate, scroll to zoom
const controls = new EASEL.OrbitControls(camera, canvas);
controls.enableDamping = true;
controls.dampingFactor = 0.12;

const sphere = new EASEL.Mesh(
  new EASEL.SphereGeometry(1, 20, 14),
  new EASEL.LambertMaterial({ color: 0x44aa88 }),
);
scene.add(sphere);

function animate() {
  requestAnimationFrame(animate);
  controls.update();  // must call each frame for damping
  renderer.render(scene, camera);
}
animate();