Escena orbital 3D

Three.js + GSAP timeline

Haz clic para cambiar forma

IcosahedronGeometry · GSAP spin timeline

orbit-scene.js

function swapTo(index) {
  const previous = currentMesh;
  const next = meshes[index];

  gsap.to(previous.scale, {
    x: 0, y: 0, z: 0,
    duration: 0.4,
    ease: 'back.in(2)',
    onComplete: () => scene.remove(previous)
  });

  next.scale.set(0, 0, 0);
  scene.add(next);

  gsap.to(next.scale, {
    x: 1, y: 1, z: 1,
    duration: 0.7,
    ease: 'elastic.out(1.2, 0.5)'
  });

  spin(next);
}

Three.js renderiza la geometría. GSAP dirige la transición: salida con `back.in`, entrada con `elastic.out` y giro continuo con `repeat: -1`.