One-Dimensional Cellular Automata generator in Javascript

Cellular Automata Result Image
Width:

Height:

Number:

Code:





00000000


(Don't set this too high!)

(Nor this!)

(0 to 255)





This calculates and displays the 256 simplest cellular automata. That is, they're one-dimensional, have two states and each cell has two neighbours, directly to either side of it. Rules 30, 90 and 110 produce interesting patterns if you want to start somewhere.

That's not the interesting part (though cellular automata are interesting things). The interesting part is that this page does it entirely in javascript, which includes generating the image. The images themselves are generated in X BitMap format and are injected into the page using the data URI scheme.

This isn't a new idea - it seems to have been independently invented again and again. Hopefully, though, this is an interesting example doing (kind of) useful work. It runs relatively fast at small sizes - at 100x100 it takes under a second, at 200x200 it takes about 3 seconds, 300x300 takes over a minute on my 3 year old low-end desktop. Don't try to generate big images using this because it will probably a) lock up your browser and b) eat all your memory, possibly locking up your whole computer. Also, note that this definitely doesn't work on any modern version of Internet Explorer. It should work in Firefox and may work in Safari and Opera. I've only tested it on Firefox 3.0.1/Windows XP. It it does work for other browsers it'd be nice if you could let me know.

Anyway, I'm placing the code in the public domain. It incorporates some code by Tyler Akins, because I'm too lazy to write my own base64 encoding routine. That's in the public domain too.

Share and Enjoy! (My blog is over here)

-- xchmp [at] xchmp [dot] com, 5th September 2008