Nav links

Friday, 16 June 2006

Flame canvas demo

Following on from my successful canvas demos of fractals I thought I'd attempt the old staple of the demo scene, the flame effect.

Luckily it's very common and very simple. There are dozens of examples in Programmers Heaven - Graphics & Sound - Fire & Flame, coded in Java, C, C++, ASM, Pascal and even QBasic. All of those are old hat, as the cool stuff is now being done online, using the canvas tag supported by all modern web browsers. Coding and deployment is much simpler, though the results are usually a tad slower.

That's enough waffling. Here's the fire. Just view the source to see the code.

This time I did the animation using setInterval() rather than setTimeout(), as it's slightly less code. I expected from their definitions that they'd be virtually identical, but setInterval() seemed to run faster but be more CPU intensive, as if the delay value was reduced. As such I increased the delay to compensate.

In addition, I used the canvas scale(x,y) command instead of doing the scaling manually. Again it slightly simplfied the code in this example, but I imagine for more complex programs the benefit would be greater.