Swarming and Biods in Javascript

by Stephen on August 10th, 2015

When I was doing my undergrad I took a course that encouraged students to explore various browser technologies (such as Javascript, canvas, etc) in their assignments. For one of these assignments I thought it would be fun to re-implement an interactive Javascript version of the swarming/biod simulation I had previously written in Java.

The biods themselves are colour-coded based on which force/rule currently dominates their heading:

Red: Claustrophobia (biods don’t like getting too close to one another, and will try to fan out a bit).

Green: Cohesion (biods will, in general attempt to move in the same average direction as their peers).

Blue: An repulsor/attractor is pulling/pushing on the biod.

The little purple guys in the bottom-left are a couple of predators. They’re programmed to chase and eat the biods (they go after the closest one in their field of vision), are faster than the biods (but have a slower turning radius) and are generally pretty fun to watch. They have a repulsor attached to them that causes our biods to flee when a predator gets close.