Which is better and why? RaphaelJS or HTML5 Canvas?

leeand00 picture leeand00 · Sep 17, 2009 · Viewed 15.1k times · Source

I found a vector library on the Internet that even works with IE6!

http://raphaeljs.com/index.html

It's amazing.

Now my question is it better than the upcoming HTML5 <canvas>? The only reason I ask is that it could be years before Microsoft implements a <canvas> that doesn't require a plugin for it to run.

And it will be even longer until all the IE users on the Internet get rid of their old browsers so that we can even justify using the HTML5 <canvas>.

I'm all about sticking to standards, but this one is just going to take too long, thanks to MS's slow development of their browser.

Thoughts?

Answer

Jani Hartikainen picture Jani Hartikainen · Sep 17, 2009

Raphael is a vector graphics library, done using SVG, whereas HTML5 canvas is bitmap graphics.

If you want to do vector graphics, I think going with Raphael is probably a good choice over "just" canvas. As you say, canvas does not quite work with IE and it will probably be a while before it's natively supported. If Raphael does what you need, there is no particular reason not to use it.

Do note that there are also other libraries for this: Excanvas, which emulates canvas for IE using VML (as far as I know), and also some others which do the same with Silverlight and Flash but I forgot their names.

There's also Dojo, which has a component for abstracting canvas usage behind an easy to use interface, which also supports IE.

Having native canvas in all browsers will not make the libraries obsolete, since the libraries usually abstract some of the canvas complexities away, making the usage easier.