IE8, excanvas und dynamisch kreierte Canvas-Elemente

Wer die offizielle ExplorerCanvas Version einsetzt, sollte bald gezwungen sein, diese upzudaten, da diese Version aus dem Jahr 2007 nicht den Windows Internet Explorer 8 im Standard-Modus unterstützt. Abhilfe schafft die aktuelle Revision 44 aus dem excanvas subversion repository.

Leider unterstützt diese Version wiederum nicht das dynamische Erstellen von canvas-Elementen. Abhilfe verschafft die Methode fixElement_, welche leider zugunsten des createElement-Workarounds gestrichen wurde. Eine Erweiterung der aktuellen excanvas-Revision, um wieder dynamisch kreierte canvas-Elemente im IE fixen zu können, könnte wie folgt aussehen:

//alte fixElement_-Methode aus Rev 26
G_vmlCanvasManager.fixElement_ = function (el) {
   // in IE before version 5.5 we would need to add HTML: to the tag name
   // but we do not care about IE before version 6
   var outerHTML = el.outerHTML;

   var newEl = el.ownerDocument.createElement(outerHTML);
   // if the tag is still open IE has created the children as siblings and
   // it has also created a tag with the name "/FOO"
   if (outerHTML.slice(-2) != "/>") {
	 var tagName = "/" + el.tagName;
	 var ns;
	 // remove content
	 while ((ns = el.nextSibling) && ns.tagName != tagName) {
	   ns.removeNode();
	 }
	 // remove the incorrect closing tag
	 if (ns) {
	   ns.removeNode();
	 }
   }
   el.parentNode.replaceChild(newEl, el);
   return newEl;
 };
//Verknüpfung zwischen fixElement_- und initElement-Methode
G_vmlCanvasManager.fixDynamicElement = function(el){
	return G_vmlCanvasManager.initElement(G_vmlCanvasManager.fixElement_(el));
};

Hiermit kann dann einfach das canvas-Element mit der Methode fixDynamicElement gefixt werden:

//...
canvasElement = G_vmlCanvasManager.fixDynamicElement(canvasElement);
//...

Ein Update lohnt in jedem Fall. Die Revision scheint nicht nur recht stabil zu sein, sondern enthält viele gute Bugfixes.

Hinweis: Inzwischen gibt es ein offizielles Release (3.) auf Grundlage der Revision 48. Das Projekt wird nun bei Google Code weiter vorangetrieben. Der oben genannte Fix für das dynamische Hinzufügen von Canvas-Elementen scheint aber weiterhin nötig zu sein .