<< JUnit in Javascript | Home | DWR version 1.0RC3 Released >>

Canvas element for IE

<canvas .../> is an HTML element that first popped up in Safari, where it helped Apple create Dashboard. It is being standardized by What-WG and added into Mozilla 1.5. I guess that Konqueror may be able to get support easily from Safari, it is on the list at least.

I've thought a number of times that this is all irrelevant for the next 5 years at least. Currently there is no <canvas .../> in IE, and I can't see Microsoft adding one into IE7, so we'd need to wait for IE8, or for IE to fall to less than 10% market-share. Even at the current 1% a month we've got another 5/6 years to go and I'm sure IE7 will slow down the decline.

So while <canvas .../> is neat I didn't plan on adding it into my list of things to investigate, until now.

I stumbled across the magic incantation: 369303C2-D7AC-11D0-89D5-00A0C90833E6 which happens to be the GUID for DirectAnimation. DirectAnimation is part of ActiveX, but so is XML.HTTP which is the foundation of Ajax in I.E.

You can see a demo of DirectAnimation - I.E. only, obviously. And it is described by WebDevelopersJournal if you want to know more.

So here is the challenge: Write some Javascript that detects lack of support for canvas, and support for DirectAnimation. It then replaces the <canvas .../> element with an <object .../> element which invokes DirectAnimation. The Javascript will then have some wrappers that convert the <canvas .../> Javascript function into DirectAnimation calls.

I have no idea if it is possible, but it sounds like it could be very interesting if it works.

Update: Emil A Eklund has implemented the Canvas Tag for IE using VML

Tags :


Re: Canvas element for IE

DirectAnimation is probably not a good choise. This is a very old activex control. M$ hasn't supported it in years. Also, it appears IE7 will ship with activex disabled. You have to turn it on for specific sites. I think it likley to expect that service packs will do the same for IE6 soon after IE7 ships. The replacement for DA, called HTML+TIME released with IE5. I don't see any word on if this is supported in IE7 or not.

Re: Canvas element for IE

Novell's XForms IE plugin has the side effect of supporting <canvas> - http://lab.cph.novell.com/nxie - haven't tested it myself though.

Re: Canvas element for IE

technologies available:

Canvas
Firefox>=1.5Beta2, Safari V?, Opera 9Preview1
procedural, no font rendering, alpha transparency

SVG
Firefox>=1.5Beta2, Opera (TinySVG), IE with Adobe Plugins
delcarative, alpha transparency, font rendering, even glyphs can be embedded

DirectAnimation
IE>=4
procedural

VML
IE>=5.5
declarative, font rendering, opacity transparency

I think, it's time for a cross-browser javascript vector drawing library. Anyone else?

Working on it

I'm working on a javascript abstraction layer atop VML/SVG, based loosely on the HotDraw framework. I'll be making announcements as stuff starts working.

Update on the canvas element

With support for the canvas element coming in Firefox 1.5, the two major alternatives to Internet Explorer (Firefox and Safari) will be one step ahead–of IE 7, that is. Some ideas are floating around how to add support for canvas to IE, however. The can