particles-physics

Particle Physics

Apply forces, fields, and constraints to create dynamic particle motion.

Quick Start

// Simple gravity + velocity
useFrame((_, delta) => {
  for (let i = 0; i < count; i++) {
    // Apply gravity
    velocities[i * 3 + 1] -= 9.8 * delta;
    
    // Update position
    positions[i * 3] += velocities[i * 3] * delta;
    positions[i * 3 + 1] += velocities[i * 3 + 1] * delta;
    positions[i * 3 + 2] += velocities[i * 3 + 2] * delta;
  }
  geometry.attributes.position.needsUpdate = true;
});

Force Types

Gravity (Constant Force)

function applyGravity(
  velocities: Float32Array,
  count: number,
  gravity: THREE.Vector3,
  delta: number
) {
  for (let i = 0; i < count; i++) {
    velocities[i * 3] += gravity.x * delta;
    velocities[i * 3 + 1] += gravity.y * delta;
    velocities[i * 3 + 2] += gravity.z * delta;
  }
}

// Usage
const gravity = new THREE.Vector3(0, -9.8, 0);
applyGravity(velocities, count, gravity, delta);

Wind (Directional + Noise)

function applyWind(
  velocities: Float32Array,
  positions: Float32Array,
  count: number,
  direction: THREE.Vector3,
  strength: number,
  turbulence: number,
  time: number,
  delta: number
) {
  for (let i = 0; i < count; i++) {
    const x = positions[i * 3];
    const y = positions[i * 3 + 1];
    const z = positions[i * 3 + 2];
    
    // Base wind
    let wx = direction.x * strength;
    let wy = direction.y * strength;
    let wz = direction.z * strength;
    
    // Add turbulence (using simple noise approximation)
    const noise = Math.sin(x * 0.5 + time) * Math.cos(z * 0.5 + time);
    wx += noise * turbulence;
    wy += Math.sin(y * 0.3 + time * 1.3) * turbulence * 0.5;
    wz += Math.cos(x * 0.4 + time * 0.7) * turbulence;
    
    velocities[i * 3] += wx * delta;
    velocities[i * 3 + 1] += wy * delta;
    velocities[i * 3 + 2] += wz * delta;
  }
}

Drag (Velocity Damping)

function applyDrag(
  velocities: Float32Array,
  count: number,
  drag: number,  // 0-1, higher = more drag
  delta: number
) {
  const factor = 1 - drag * delta;
  
  for (let i = 0; i < count; i++) {
    velocities[i * 3] *= factor;
    velocities[i * 3 + 1] *= factor;
    velocities[i * 3 + 2] *= factor;
  }
}

// Quadratic drag (more realistic)
function applyQuadraticDrag(
  velocities: Float32Array,
  count: number,
  coefficient: number,
  delta: number
) {
  for (let i = 0; i < count; i++) {
    const vx = velocities[i * 3];
    const vy = velocities[i * 3 + 1];
    const vz = velocities[i * 3 + 2];
    
    const speed = Math.sqrt(vx * vx + vy * vy + vz * vz);
    if (speed > 0) {
      const dragForce = coefficient * speed * speed;
      const factor = Math.max(0, 1 - (dragForce * delta) / speed);
      
      velocities[i * 3] *= factor;
      velocities[i * 3 + 1] *= factor;
      velocities[i * 3 + 2] *= factor;
    }
  }
}