마칭 큐브(메타볼)

import * as THREE from 'three';
import { MarchingCubes } from 'three/addons/objects/MarchingCubes.js';
const renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setPixelRatio(Math.min(devicePixelRatio, 2));
document.body.appendChild(renderer.domElement);
const scene = new THREE.Scene();
scene.background = new THREE.Color(0x06070f);
const camera = new THREE.PerspectiveCamera(45, 1, 0.1, 100);
camera.position.set(0, 0, 4.6);
camera.lookAt(0, 0, 0);
scene.add(new THREE.AmbientLight(0x445577, 1.2));
const dl = new THREE.DirectionalLight(0xffffff, 1.3);
dl.position.set(3, 4, 4);
scene.add(dl);

const RES = 32;
const mat = new THREE.MeshStandardMaterial({ color: 0x6fb8ff, roughness: 0.3, metalness: 0.15 });
const mc = new MarchingCubes(RES, mat, true, true, 60000);
mc.position.set(0, 0, 0);
mc.scale.setScalar(1.7);
scene.add(mc);

const NUM = 5;
function resize() { renderer.setSize(innerWidth, innerHeight); camera.aspect = innerWidth / innerHeight; camera.updateProjectionMatrix(); }
addEventListener('resize', resize); resize();
renderer.setAnimationLoop((t) => {
  const time = t * 0.0007;
  mc.reset();
  const strength = 1.15 / ((Math.sqrt(NUM) - 1) / 4 + 1);
  const subtract = 11;
  for (let i = 0; i < NUM; i++) {
    const bx = Math.sin(i * 3.1 + time * 1.1 * (1.0 + 0.3 * Math.cos(i * 1.7))) * 0.26 + 0.5;
    const by = Math.abs(Math.cos(i * 2.3 + time * 0.9 * (0.3 + 0.5 * Math.cos(i * 0.8)))) * 0.6 + 0.2;
    const bz = Math.cos(i * 1.9 + time * 1.3 + i) * 0.26 + 0.5;
    mc.addBall(bx, by, bz, strength, subtract);
  }
  mc.update();
  mc.rotation.y = time * 0.3;
  renderer.render(scene, camera);
});