Html 如何在 IE 中使用 HTML5 画布元素?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/1332501/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How can I use the HTML5 canvas element in IE?
提问by Kshitij Saxena -KJ-
I am trying to use the HTML5 canvas element to draw some arcs and circles - this works perfectly in FF but IE8 does not seem to support it.
我正在尝试使用 HTML5 画布元素来绘制一些弧线和圆 - 这在 FF 中非常有效,但 IE8 似乎不支持它。
Now, there exist Javascript libraries which seem to make IE8 work well with Canvas. An example can be found here.
现在,有一些 Javascript 库似乎使 IE8 可以很好地与 Canvas 配合使用。一个例子可以在这里找到。
I have read their entire source but I cannot understand how they are making Canvas work with IE8. Can somebody please throw some light on the method used?
我已经阅读了他们的全部源代码,但我无法理解他们如何使 Canvas 与 IE8 一起工作。有人可以对所使用的方法有所了解吗?
回答by Shog9
The page is using excanvas- a JS library that simulates the canvas element using IE's VML renderer.
该页面使用excanvas- 一个使用 IE 的 VML 渲染器模拟画布元素的 JS 库。
Note that in Internet Explorer 9, the canvas tag is supported natively! See MSDN docsfor details...
回答by buzzilo
You can try fxCanvas: https://code.google.com/p/fxcanvas/
你可以试试 fxCanvas:https: //code.google.com/p/fxcanvas/
It implements almost all Canvas API within flash shim.
它在 flash shim 中实现了几乎所有的 Canvas API。
回答by LondonBasedEngineer
You could use the newly released Chrome Frame plugin for IE, but it requires that the HTML 5 website includes the special meta tag that enables the plugin.
您可以为 IE 使用新发布的 Chrome Frame 插件,但它要求 HTML 5 网站包含启用该插件的特殊元标记。
http://code.google.com/chrome/chromeframe/
http://code.google.com/chrome/chromeframe/
Chrome Frame seems to use Explore Canvas (excanvas.js).
Chrome Frame 似乎使用了 Explore Canvas (excanvas.js)。
回答by Eric Rowell
Currently, ExplorerCanvas is the only option to emulate HTML5 canvas for IE6, 7, and 8. You're also right about its performance, which is pretty poor.
目前,ExplorerCanvas 是为 IE6、7 和 8 模拟 HTML5 画布的唯一选项。您对它的性能也说得对,它的性能非常差。
I found a particle simulatior that benchmarks the difference between true HTML5 canvas handling in Google Chrome, Safari, and Firefox, vs ExplorerCanvas in IE. The results show that the major browsers that do support the canvas tag run about 20 to 30 times faster than the emulated HTML5 in IE with ExplorerCanvas.
我找到了一个粒子模拟器,可以对 Google Chrome、Safari 和 Firefox 中真正的 HTML5 画布处理与 IE 中的 ExplorerCanvas 之间的差异进行基准测试。结果表明,支持 canvas 标签的主要浏览器的运行速度比使用 ExplorerCanvas 在 IE 中模拟的 HTML5 快 20 到 30 倍。
I doubt that anyone will go through the effort of creating an alternative because 1) excanvas.js is about as cleanly coded as it gets and 2) when IE9 is released all of the major browsers will finally support the canvas object. Hopefully, We'll get IE9 within a year
我怀疑是否有人会努力创建替代方案,因为 1) excanvas.js 的编码非常干净,2) 当 IE9 发布时,所有主要浏览器都将最终支持画布对象。希望我们能在一年内获得 IE9
Eric @ www.webkrunk.com
埃里克@www.webkrunk.com
回答by Timbergus
If you need to use IE8, you can try this JavaScript library for vector graphics. It is like solving the "canvas" and "SVG" incompatibilities of IE8 at the same time.
如果你需要使用 IE8,你可以试试这个用于矢量图形的 JavaScript 库。就像同时解决了IE8的“canvas”和“SVG”不兼容问题。
I have just try it in a fast example and it works correctly. I don't know how legible is the source code but I hope it helps you. As they said in its site, the library is compatible with very old explorers.
我刚刚在一个快速示例中尝试过它并且它工作正常。我不知道源代码的可读性如何,但我希望它对您有所帮助。正如他们在其网站上所说,图书馆与非常古老的探险家兼容。
Rapha?l currently supports Firefox 3.0+, Safari 3.0+, Chrome 5.0+, Opera 9.5+ and Internet Explorer 6.0+.
Rapha?l 目前支持 Firefox 3.0+、Safari 3.0+、Chrome 5.0+、Opera 9.5+ 和 Internet Explorer 6.0+。
回答by duma
I just used flashcanvas, and I got that working. If you encounter problems, just make sure to read the caveats and whatnot. Particularly, if you create canvas elements dynamically, you need to initialize them explicitly:
我只是使用flashcanvas,我得到了它的工作。如果您遇到问题,请务必阅读注意事项等。特别是,如果您动态创建画布元素,则需要显式初始化它们:
if (typeof FlashCanvas != "undefined") {
FlashCanvas.initElement(canvas);
}