A simple, lightweight physics engine ported from CoffeeScript to TypeScript
npm install coffee-physics-ts```
import {
Vector,
Particle,
Physics,
Spring,
Euler,
ImprovedEuler,
Verlet,
Attraction,
Collision,
ConstantForce,
EdgeBounce,
EdgeWrap,
Gravity,
Wander,
} from "coffee-physics-ts"
``
const physics = new Physics(new Verlet())
Coffee Physics offers three integrations methods: Euler, ImprovedEuler, and Verlet. Verlet integration is required for simulating particle collisions. Euler integration will be used if no method is specified.
``
const avoid = new Attraction(undefined, 100, -1000)
const pullToCenter = new Attraction(undefined, undefined, 120)
const collision = new Collision()
Coffee Physics provides the following behaviours:
- Attraction applies an attractive force to particles within a certain radius towards a target point.Collision
- detects collisions between particles and reacts accordingly, either by stopping particles from overlapping or by bouncing them off each other.ConstantForce
- applies a constant force causing particles to accelerate.EdgeBounce
- bounces particles off the edges of the specified min and max boundaries.EdgeWrap
- wraps particles around to the opposite side of the specified min and max boundaries.Gravity
- applies a gravitational force to particles. On devices with motion sensors the direction and magnitude of the force is controlled by tilting the device. Wander
- simulates an organic, meandering motion often seen in natural systems
``
physics.behaviours = [avoid, pullToCenter, collision]
These behaviours will affects all particles in the simulation
`
const particles = []
for (let i = 0; i < 200; i++) {
// Create a particle
const mass = 2
const particle = new Particle(mass)
particle.setRadius(mass * 10)
// Make it collidable by adding it to the collision pool
collision.pool.push(particle)
// Then add it to the simulation
physics.particles.push(particle)
}
`
Behaviours can also be applied to a particle directly: particle.behaviours = [avoid, pullToCenter, collision]
``
let animationFrameId = null
const updatePhysics = () => {
physics.step()
animationFrameId = requestAnimationFrame(updatePhysics)
}
animationFrameId = requestAnimationFrame(updatePhysics)
```
cancelAnimationFrame(animationFrameId)
Coffee Physics TS is just a physics engine. The only job it does is to calculate the position of particles in the simulation. That means you need to combine it with a system for drawing the particles in the browser.
Check out this demo that uses React and Framer Motion.