Canvas Element

Publish Date:

So… when to use canvas, and when to use SVG? HTML5doctors recent blogpost has an introduction to canvas and also tells you the differences between the 2.

canvas:

*no layers

*good for pixel manipulation & highly active animations

SVG:

*layers

*exists in DOM

**-> easy to attach event handlers for interactivity

*easier to deal with collision detection (e.g. for games)

*Animation support through SMIL or JavaScript

I’d post an example of using canvas here, but wordpress will remove the canvas tag.

So… here it is for download. canvas example (it’s an example and reference in one; so yeah, the clearRect is useless at the beginnin but useful to know it exists)

The Mozilla Wiki has some very interesting examples of canvas usage.