Wie kann ich das HTML5-Canvas-Element in IE verwenden?

Question

Ich versuche, das HTML5-Canvas-Element zu verwenden, um einige Bögen und Kreise zu zeichnen - das funktioniert perfekt in FF, aber IE8 scheint es nicht zu unterstützen.

Jetzt gibt es Javascript-Bibliotheken, die IE8 scheinen gut mit Canvas funktionieren. An example can be found here.

Ich habe ihre gesamte Quelle gelesen, aber ich kann nicht verstehen, wie sie Canvas Arbeit mit IE8 machen. Kann jemand bitte etwas Licht auf die Methode werfen?

Answer 1

Die Seite verwendet excanvas - eine JS-Bibliothek, die das Canvas-Element mit dem VML-Renderer von IE simuliert.

Beachten Sie, dass in Internet Explorer 9, the canvas tag is supported natively! Weitere Informationen finden Sie unter MSDN docs

Answer 2

Sie könnten das neu veröffentlichte Chrome Frame-Plug-in für IE verwenden, aber es erfordert, dass die HTML 5-Website das spezielle Meta-Tag enthält, das das Plug-in aktiviert.

http://code.google.com/chrome/chromeframe/

Chrome Frame scheint erkunden Leinwand (excanvas.js) zu verwenden.

Answer 3

Zur Zeit ist ExplorerCanvas die einzige Option, HTML5-Canvas für IE6, 7 und 8 zu emulieren. Sie haben auch recht mit seiner Leistung, die ziemlich schlecht ist.

Ich habe einen Partikel-Simulator gefunden, der den Unterschied zwischen echtem HTML5-Canvas-Handling in Google Chrome, Safari und Firefox gegenüber ExplorerCanvas im IE vergleicht. Die Ergebnisse zeigen, dass die wichtigsten Browser, die das Canvas-Tag unterstützen, etwa 20 bis 30 Mal schneller laufen als das emulierte HTML5 in IE mit ExplorerCanvas.

Ich bezweifle, dass jemand die Mühe der Erstellung einer Alternative gehen wird, weil 1) excanvas.js etwa so sauber codiert ist, wie es geht und 2) wenn IE9 veröffentlicht wird, unterstützen alle gängigen Browser schließlich das Canvas-Objekt. Hoffentlich werden wir bekommen IE9 innerhalb eines Jahres

Eric @ www.webkrunk.com

Answer 4

Sie können fxCanvas versuchen: https://code.google.com/p/fxcanvas/

Es implementiert fast alle Canvas-API in Flash-Shim.

Answer 5

Ich habe gerade flashcanvas verwendet, und ich habe das funktioniert. Wenn Sie auf Probleme stoßen, lesen Sie einfach die Vorbehalte und was nicht. wenn Sie Canvas-Elemente erstellen Besonders dynamisch, müssen Sie sie explizit initialisieren:

if (typeof FlashCanvas != "undefined") { 
    FlashCanvas.initElement(canvas); 
} 

Answer 6

Wenn Sie IE8 verwenden müssen, können Sie diese JavaScript-Bibliothek für Vektorgrafiken versuchen. Es ist so, als würden die "Canvas" - und "SVG" -Inkompatibilitäten von IE8 gleichzeitig gelöst.

Raphaël

Ich habe nur versuchen, es in einem schnellen Beispiel und es funktioniert einwandfrei. Ich weiß nicht, wie lesbar der Quellcode ist, aber ich hoffe, es hilft dir. Wie sie auf ihrer Website sagten, ist die Bibliothek mit sehr alten Entdeckern kompatibel.

Raphaël unterstützt derzeit Firefox 3.0+, Safari 3.0+, Chrome 5.0+, Opera 9.5+ und Internet Explorer 6.0+.