L-system

For reasons unknown to myself, I stumbled home late Saturday night/Sunday morning and on a whim it hit me: fractals in JavaScript! An hour later I had the following set running, slowed largely by an initial misstep relying on the Raphaël vector graphics library which turned out being dog-slow for my purposes. I reverted to using the plain old Canvas element, although of course that kills IE support.

The following L-system (Lindenmayer system) fractals have been implemented:

• Hilbert Curve
• Kosh Curve (90 degree variant)
• Sierpinski Triangle
• Dragon Curve
• Gosper Curve
• Fractal Plant

Fractals are something I’ve had surprisingly had limited experience before, so no doubt my implementation is rather naïve. L-system as it turns out is rather trivial to implement, following some basic rewriting rules that translate to instructions reminiscent of good old Logo / turtle graphics. Mandelbrot will be next when I get a chance as it should provide more of a challenge.

Click here to view; they should play in sequence (browser support permitting). The number of iterations is largely limited by screen real estate. I could add proper scaling but I have to work tomorrow - those interface contracts aren’t going to write themselves!