Collision-free ant farm in Javascript

This bounty is for the construction of a 2d ant farm animation in Javascript.

Please provide the JS to animate a canvas with ants moving on pseudo-random paths. Ants should avoid collisions with each other and the canvas walls. The animation should run smoothly with 200 ants at 1300x1300 px.

More guidelines:

  • Parameters: canvas size (it should be square), base ant speed, number of ants, background color.
  • Individual ant speed should be random, from 50% of base ant speed (BAS) to 200% of BAS.
  • Ants have a head, midsection, and tail; those body components can be round. They should also have straight black antennae.
  • Each head/midsection/tail component of each ant is a random pastel color and has a thin black outline.
  • Each ant should have six moving legs that 'swing' back and forth from a fixed point on its body to simulate walking (binary motion is ok).
  • The path of ants should simulate real ants somewhat: it should be mostly straight, yet always somewhat curvy, and should change somewhat frequently while in motion. It's ok if it's not very convincing; most importantly it should change direction smoothly while moving forward.
  • Ants should pause for a random amount of time (up to 1 second) if they collide. They should then rotate in a random direction and continue if possible. You can assume the outline of each ant is rectangular when calculating intersections. Ants should never overlap.
  • Ant size should be about 1 cm from head to tail (antennae can extend past that).
  • Ants should not travel outside the bounds of the canvas; if it is in front of them, they should rotate a random angle and continue if possible.
  • Jquery is fine, but please ask before using other plugins


awarded to Wikimedia

Crowdsource coding tasks.

0 Solutions