HTML5 Canvas can work even in Internet Explorer 6

The most heard criticism about Canvas is that it’s not supported in IE, and because of that it will only be usable in 12 years. This is certainly not true, I have found a solution that can make a Canvas application work even in IE6, it’s called Explorer Canvas, an Internet Explorer specific implementation of the HTML5 Canvas, and not it’s not a browser plugin, it’s a JavaScript file. We just include excanvas.js like this:

<!--[if IE]><script type="text/javascript" src="excanvas.js"></script><![endif]-->

and let Explorer Canvas do the rest.

This wonderful piece of software was brought to us by Google, and it’s available at http://code.google.com/p/explorercanvas/.

I know this is all nice but: does it really work?

Well I took my very simple graph application and took it for a test run under IE with this included. I got a script error, because fillText is not supported under excanvas, so I took these two lines out and the rest of my code worked, even under IE6:

Now skeptic people may say “HAH, fillText is not supported, this FAILS!”, but the fact is that we could replace these parts, I mean we don’t really need Canvas to draw text most of the time, we can already do that with HTML. So most of the time we could live with this limitation and have a pixel perfect rendering!

There are other things that are not (yet) supported by excanvas, but most of the features are! So I encourage people doing charts to try to use this instead of a flash based solution.

I also made a downloadable package of the experiment I showed earlier, but the excanvas package contains cooler demos. Looking forward to doing more advanced things in the future with all this.

Tags: , , ,

This entry was posted on Thursday, May 20th, 2010 at 12:51 am and is filed under HTML5, JavaScript. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.