{"id":121,"date":"2014-03-11T00:08:43","date_gmt":"2014-03-10T16:08:43","guid":{"rendered":"http:\/\/www.hightopo.com\/blog\/?p=121"},"modified":"2014-03-11T00:08:43","modified_gmt":"2014-03-10T16:08:43","slug":"%e4%bb%8eie6%e5%88%b0ie11%e4%b8%8a%e8%bf%90%e8%a1%8cwebgl-3d%e9%81%87%e5%88%b0%e7%9a%84%e5%90%84%e7%a7%8d%e5%9d%91","status":"publish","type":"post","link":"https:\/\/www.hightopo.com\/blog\/121.html","title":{"rendered":"\u4eceIE6\u5230IE11\u4e0a\u8fd0\u884cWebGL 3D\u9047\u5230\u7684\u5404\u79cd\u5751"},"content":{"rendered":"<p>\u8fd9\u7bc7\u300a<a href=\"http:\/\/www.hightopo.com\/blog\/95.html\">\u57fa\u4e8eHTML5\u7684\u7535\u4fe1\u7f51\u7ba13D\u673a\u623f\u76d1\u63a7\u5e94\u7528<\/a>\u300b\u57fa\u4e8eWebGL\u6280\u672f\u7684\u5e94\u7528\u8ba9\u5c11\u540c\u5b66\u5bf9HTML5\u7684\u5e94\u7528\u4ea7\u751f\u4e86\u5174\u8da3\u548c\u4fe1\u5fc3\uff0c\u4f46\u6709\u4e0d\u5c11\u7f51\u53cb\u79c1\u4fe1\u8be2\u95eeWebGL\u5982\u4f55\u8fd0\u884c\u5728\u8001\u7684IE678910\u6d4f\u89c8\u5668\u7684\u95ee\u9898\uff0c\u6bd5\u7adf\u4f5c\u4e3a\u4f01\u4e1a\u5e94\u7528\uff0c\u7528\u6237\u7684\u673a\u5668\u8fd0\u884c\u7740\u5404\u5f0f\u5404\u6837\u7684\u529e\u516c\u53ca\u4e1a\u52a1\u7cfb\u7edf\uff0c\u6709PB\/Delphi\u4e4b\u7c7b\u7684\u8001CS\u5e94\u7528\uff0c\u6709\u5b89\u88c5\u4e86dll\u548cActiveX\u7684\u5404\u79cd\u5b89\u5168\u8ba4\u8bc1\u548c\u89c6\u9891\u76d1\u63a7\u7684\u63d2\u4ef6\uff0c\u6709\u88c5\u7740flash\u6216svg\u63d2\u4ef6\u7684flex\u548cSVG\u5e94\u7528\uff0c\u5f53\u7136\u8fd8\u6709\u652f\u6301IE6\u5374\u4e0d\u652f\u6301\u4efb\u4f55\u975eIE\u6d4f\u89c8\u5668\u7684\u5404\u79cdOA\u529e\u516c\u8f6f\u4ef6\uff0c\u773c\u770b\u7740XP\u64cd\u4f5c\u7cfb\u7edf\u5373\u5c06\u5bff\u7ec8\u6b63\u5bdd\uff0c\u7ed3\u679c\u8fd8\u6210\u4e86\u56fd\u5185\u5404\u5bb6\u5b89\u5168\u516c\u53f8\u7684\u65b0\u5546\u673a\u300a<a href=\"http:\/\/tech.sina.com.cn\/z\/weilieXP\/\">\u56f4\u730eXP\uff1a\u8c01\u5728\u7784\u51c6\u5546\u673a<\/a>\u300b\uff0c\u4f60\u8bf4\u5347\u7ea7\u673a\u5668\u7cfb\u7edf\u8c08\u4f55\u5bb9\u6613\uff1f<\/p>\n<p><a href=\"http:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.40.57-PM.png\"><img loading=\"lazy\" class=\"alignnone size-full wp-image-124\" alt=\"Screen Shot 2014-03-10 at 11.40.57 PM\" src=\"http:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.40.57-PM.png\" width=\"1070\" height=\"527\" srcset=\"https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.40.57-PM.png 1070w, https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.40.57-PM-300x147.png 300w, https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.40.57-PM-1024x504.png 1024w, https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.40.57-PM-200x98.png 200w\" sizes=\"(max-width: 1070px) 100vw, 1070px\" \/><\/a><\/p>\n<p>\u5bf9\u4e8e\u6211\u4eec\u65e0\u529b\u8981\u6c42\u5347\u7ea7\u7684IE678910\u4e0a\u8981\u8dd1WebGL\uff0c\u6211\u4eec\u53ea\u80fd\u91c7\u7528<a href=\"http:\/\/www.chromium.org\/developers\/how-tos\/chrome-frame-getting-started\/chrome-frame-faq#TOC-For-Developers\">Google Chrome Frame<\/a>\u7684\u89e3\u51b3\u65b9\u6848\uff0c\u867d\u7136\u8be5\u63d2\u4ef6Google\u4ece2014\u5e741\u6708\u4efd\u8d77\u5c31\u4e0d\u518d\u7ef4\u62a4\u66f4\u65b0\u4e86\uff0c\u4f46\u5df2\u7ecf\u53d1\u5e03\u7684\u7248\u672c\u4e5f\u662f31\u4e86\uff0c\u8fd9\u4e2a\u7248\u672c\u7684WebGL\u529f\u80fd\u5df2\u7ecf\u8db3\u591f\u5b8c\u5584\u4e86\uff0c\u5f53\u7136\u8fd9\u6837\u7684\u89e3\u51b3\u65b9\u6848\u4e5f\u4e00\u7bad\u53cc\u96d5\u7684\u89e3\u51b3\u4e862D\u7684Canvas\u95ee\u9898\u3002<\/p>\n<p>\u5b89\u88c5\u5b8c\u8be5\u63d2\u4ef6\u540e\uff0c\u5728\u4f60\u9700\u8981\u91c7\u7528WebGL\u7684\u9875\u9762\u589e\u52a0\u4e00\u884c&lt;meta http-equiv=&#8221;X-UA-Compatible&#8221; content=&#8221;chrome=1&#8243;&gt;\u4ee3\u7801\u5373\u53ef\uff0c\u6216\u8005\u4ece\u670d\u52a1\u5668\u4e0b\u53d1\u8be5\u9875\u9762\u662f\u5bf9HTTP\u5934\u589e\u52a0X-UA-Compatible: chrome=1\u7684\u53c2\u6570\u5373\u53ef\u3002<\/p>\n<p>\u4f7f\u7528<code>Google Chrome Frame<\/code>\u8fd8\u9700\u8981\u6ce8\u610f\u4e00\u4e0b\u51e0\u70b9\uff1a<\/p>\n<ul>\n<li><code>Google Chrome Frame<\/code>\u4e0d\u652f\u6301\u76f4\u63a5\u4ece\u672c\u5730<code>local file<\/code>\u65b9\u5f0f\u6253\u5f00\u9875\u9762\uff0c\u5fc5\u987b\u628a\u9875\u9762\u90e8\u7f72\u5230<code>Web<\/code>\u670d\u52a1\u5668\u53d1\u5e03\u65b9\u5f0f\u6253\u5f00\u624d\u80fd\u8fd0\u884c\u51fa\u6548\u679c<\/li>\n<li><code>Google Chrome Frame<\/code>\u4e0d\u652f\u630164\u4f4d\u7684\u673a\u5668\uff1a<a href=\"http:\/\/www.chromium.org\/developers\/how-tos\/chrome-frame-getting-started\/chrome-frame-faq#TOC-Does-Google-Chrome-Frame-work-on-64-bit-IE-\">Currently, 64-bit versions of IE are not supported. It&#8217;s worth pointing out that 32-bit IE is the default on 64-bit Windows 7.<\/a><\/li>\n<li><code>Google Chrome Frame<\/code>\u4e0d\u652f\u6301<code>iframe<\/code>\u65b9\u5f0f\uff1a\u00a0<a href=\"http:\/\/stackoverflow.com\/questions\/2465322\/opening-an-iframe-for-ie-while-using-chrome-frame\">At this point ChromeFrame only supports the meta tag detection on top level URLs.<br \/>\n<\/a><\/li>\n<\/ul>\n<p><span style=\"line-height: 1.5em;\">\u53ef\u91c7\u7528\u5d4c\u5165<\/span><code style=\"line-height: 1.5em;\">OBJECT<\/code><span style=\"line-height: 1.5em;\">\u5143\u7d20\u7684<\/span><a style=\"line-height: 1.5em;\" href=\"http:\/\/src.chromium.org\/viewvc\/chrome\/trunk\/src\/chrome_frame\/host.html\">\u89e3\u51b3\u65b9\u6848<\/a><span style=\"line-height: 1.5em;\">\uff0c\u7ed5\u5f00<\/span><code style=\"line-height: 1.5em;\">Google Chrome Frame<\/code><span style=\"line-height: 1.5em;\">\u4e0d\u652f\u6301<\/span><code style=\"line-height: 1.5em;\">iframe<\/code><span style=\"line-height: 1.5em;\">\u7684\u95ee\u9898<\/span><\/p>\n<pre><code>&lt;OBJECT ID=\"ChromeFrame\" WIDTH=500 HEIGHT=500 CODEBASE=\"http:\/\/www.google.com\"\r\n        CLASSID=\"CLSID:E0A900DF-9611-4446-86BD-4B1D47E7DB2A\"&gt;\r\n    &lt;PARAM NAME=\"src\" VALUE=\"http:\/\/www.google.com\"&gt;\r\n    &lt;embed ID=\"ChromeFramePlugin\" WIDTH=500 HEIGHT=500 NAME=\"ChromeFrame\"\r\n        SRC=\"http:\/\/www.google.com\" TYPE=\"application\/chromeframe\"&gt;\r\n    &lt;\/embed&gt;\r\n&lt;\/OBJECT&gt;\r\n<\/code><\/pre>\n<p>\u4ee5\u4e0a\u662f\u6211\u4f7f\u7528Google Chrome Frame\u89e3\u51b3\u8001IE\u6d4f\u89c8\u5668\u9047\u5230\u7684\u4e00\u4e9b\u5751\u7684\u89e3\u51b3\u65b9\u6848\uff0c\u5982\u679c\u4f60\u8fd8\u9047\u5230\u5176\u4ed6\u95ee\u9898\u53ef\u53c2\u8003<code>Google Chrome Frame<\/code>\u7684<a href=\"http:\/\/www.chromium.org\/developers\/how-tos\/chrome-frame-getting-started\">Developer Guide<\/a>\u00a0\u548c<a href=\"http:\/\/www.chromium.org\/developers\/diagnostics\/gcf_troubleshooting\">Troubleshooting<\/a>\u00a0\u3002<\/p>\n<p>\u8fd8\u597d\uff0c\u6211\u4eec\u9047\u5230\u7684\u4e0d\u5c11\u9879\u76ee\u8fd8\u662f\u5141\u8bb8\u8d2d\u4e70\u65b0\u673a\u5668\u6216\u8005\u5347\u7ea7\u65b0\u6d4f\u89c8\u5668\u7cfb\u7edf\u7684\uff0c\u4f46\u8fd9\u5e76\u4e0d\u4ee5\u4e3a\u8fd9\u80fd\u4e0aIE11\u5c31\u95ee\u9898\u7ed3\u675f\u4e86\uff0c\u5fae\u8f6f\u8fd9\u54e5\u4eec\u5bf9\u65b0\u6807\u51c6\u7684\u652f\u6301\u8981\u561b\u843d\u540e\u534a\u62cd\uff0c\u8981\u561b\u660e\u77e5\u6807\u51c6\u5c31\u8fd9\u6837\u6211TMD\u7684\u5c31\u4e0d\u5b9e\u73b0\u4f60\u80fd\u548b\u5730\uff0c\u76f8\u4fe1preserve-3d\u7684CSS3\u529f\u80fd\u8ba9\u591a\u5c11\u4eba\u6b23\u559c\u8bfa\u72c2\uff0c\u7684\u786e\u5982\u679cCSS3\u76843D\u529f\u80fd\u5404\u5bb6\u6d4f\u89c8\u5668\u80fd\u597d\u597d\u5b9e\u73b0\u5f88\u591a\u5e94\u7528\u4e5f\u5c31\u6ca1WebGL\u5565\u4e8b\u4e86\uff0c\u4f8b\u5982\u8457\u540d\u7684<a href=\"http:\/\/www.famo.us\/\">famo.us\u00a0<\/a>\u7684\u7ecf\u5178\u5143\u7d20\u5468\u671f\u8868\u4f8b\u5b50\uff0c\u5c3c\u739b\u7684IE\u4f7f\u7528\u8005\u5c31\u65e0\u798f\u4eab\u53d7\uff0c\u770b\u770b\u4ee5\u4e0bMS\u4eba\u7684\u8bdd\uff0c\u6211\u77e5\u9053preserve-3d\u662fw3c\u6807\u51c6\uff0c\u8001\u5b50\u5c31\u4e0d\u5b9e\u73b0\uff0c\u60f3\u7528\u7684\u81ea\u5df1\u641e\u8e69\u811a\u7684\u89e3\u51b3\u65b9\u6848\u7ed5\u9053\uff1a<\/p>\n<p><a href=\"http:\/\/msdn.microsoft.com\/en-us\/library\/ie\/hh673529(v=vs.85).aspx\">http:\/\/msdn.microsoft.com\/en-us\/library\/ie\/hh673529(v=vs.85).aspx<\/a><br \/>\nNote The W3C specification defines a keyword value of preserve-3d for this property, which indicates that flattening is not performed. At this time, Internet Explorer 10 does not support the preserve-3d keyword. You can work around this by manually applying the parent element&#8217;s transform to each of the child elements in addition to the child element&#8217;s normal transform.<\/p>\n<p><a href=\"http:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.44.25-PM.png\"><img loading=\"lazy\" class=\"alignnone size-full wp-image-127\" alt=\"Screen Shot 2014-03-10 at 11.44.25 PM\" src=\"http:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.44.25-PM.png\" width=\"768\" height=\"573\" srcset=\"https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.44.25-PM.png 768w, https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.44.25-PM-300x223.png 300w, https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.44.25-PM-200x149.png 200w\" sizes=\"(max-width: 768px) 100vw, 768px\" \/><\/a><\/p>\n<p>CSS3\u7684\u95ee\u9898\u4e0b\u56de\u518d\u626f\u6de1\uff0c\u90a3\u662f\u4e2a\u65e0\u7a77\u65e0\u5c3d\u7684\u8bdd\u9898\uff0c\u56de\u5230\u6211\u4eec\u7684\u53f7\u79f0\u652f\u6301WebGL\u7684IE11\uff0c\u81f3\u4ece\u4e00\u5e74\u524d\u6709\u4eba<a href=\"http:\/\/www.theverge.com\/2013\/3\/30\/4165204\/microsoft-bringing-webgl-support-internet-explorer-11-windows-blue\">\u6cc4\u9732IE11\u5c06\u652f\u6301WebGL<\/a>\u5c31\u5f15\u5f97\u4e1a\u754c\u4e00\u7247\u5174\u594b\uff0c\u5343\u547c\u4e07\u5524\u59cb\u51fa\u6765\u540e\u5c45\u7136\u8fd8\u6709\u90a3\u4e48\u591a\u7f3a\u9677\uff0c\u4f46\u7ec8\u5f52\u8fd8\u662f\u5927\u597d\u4e8b\uff0c\u8fc8\u51fa\u7b2c\u4e00\u6b65\u662f\u6700\u96be\u7684\uff0c\u76f8\u4fe1\u5fae\u8f6f\u4f1a\u6162\u6162\u5b8c\u5584\uff0c\u4f46\u6bd5\u7adf\u6d3b\u5728\u5f53\u4e0b\u7684\u6211\u4eec\u8fd8\u5f97\u7ee7\u7eed\u586bShading Language\u4e0a\u7684\u51e0\u4e2a\u5751\uff1a<\/p>\n<p>1\u3001lineWidth\u4e0d\u8ba9\u8bbe\u7f6e\uff0c\u53ea\u652f\u63011\u4e2a\u50cf\u7d20\u7684\u8fde\u7ebf\uff0c\u53ea\u80fd\u7528\u4e00\u4e2a\u50cf\u7d20\u5c06\u5c31\u7740\uff0c\u6216\u8005\u628a\u7ebf\u91c7\u7528\u6784\u5efa\u6a21\u578b\u7684\u91cd\u65b9\u5f0f\u6765\u66ff\u4ee3<\/p>\n<p>2\u3001Stencil buffers\u8fd8\u4e0d\u652f\u6301\uff0cclearStencil\u4e4b\u7c7b\u7684\u51fd\u6570\u5c31\u4e0d\u8981\u8003\u8651\u7528\u4e86<\/p>\n<p>3\u3001TRIANGLE_FAN\u7c7b\u578b\u4e0d\u652f\u6301\uff0c\u8fd9\u4e2a\u8fd8\u597d\u529e\uff0c\u6539\u7528TRIANGLES\u66ff\u4ee3\u9876\u591a\u589e\u52a0\u70b9\u9876\u70b9\u6570\u636e<\/p>\n<p>4\u3001\u4e0d\u652f\u6301return\u8bed\u53e5\uff0c\u4f60\u59b9\u7684\u8fd9\u4e2a\u95ee\u9898\u8ba9\u6211\u82e6\u82e6\u627e\u4e86\u534a\u5929\u624d\u53d1\u73b0\uff0c\u53ea\u80fd\u6539\u53d8\u4ee3\u7801\u903b\u8f91\u4e0d\u7528return\u7684\u65b9\u5f0f<\/p>\n<p>\u76ee\u524d\u6211\u9047\u5230\u7684\u5c31\u8fd9\u4e9b\u5751\u4e86\uff0c\u6709\u6454\u5012\u5728\u5176\u4ed6\u5751\u7684\u540c\u5b66\u53ef\u4ee5\u7ee7\u7eed\u8865\u5145\uff0c\u91c7\u7528<a href=\"http:\/\/threejs.org\/\">threejs<\/a>\uff0c<a href=\"http:\/\/blogs.msdn.com\/b\/eternalcoding\/archive\/2013\/06\/27\/babylon-js-a-complete-javascript-framework-for-building-3d-games-with-html-5-and-webgl.aspx\">babylonjs<\/a>\u548c<a href=\"http:\/\/www.hightopo.com\/\">Hightopo<\/a>\u7b493D\u5f15\u64ce\u5c01\u88c5\u7684\u6846\u67b6\u81ea\u7136\u90fd\u4f1a\u5e2e\u6211\u4eec\u5e94\u7528\u5c42\u5c4f\u853d\u8fd9\u4e9b\u5751\uff0c\u4f46\u76f8\u4fe1\u5f88\u591a\u5f15\u64ce\u5e76\u8fd8\u672a\u5bf9IE11\u505a\u8003\u8651\uff0c\u6bd5\u7adf\u8fd9\u54e5\u4eec\u5e02\u573a\u5360\u6709\u7387\u8fd8\u4e0d\u9ad8\uff0c\u7b49\u8db3\u591f\u9ad8\u4e86\u503c\u5f97\u8003\u8651\u65f6\u4e5f\u8bb8\u5fae\u8f6f\u81ea\u5df1\u5df2\u7ecf\u586b\u8865\u597d\u4e86\u5751\uff0c\u65e0\u9700\u6211\u4eec\u518d\u64cd\u5fc3\u4e86\uff0c\u4f46\u5df2\u5fae\u8f6f\u53d1\u5e03\u65b0\u6d4f\u89c8\u5668\u7248\u672c\u7684\u8282\u594f\uff0c\u6211\u53ea\u80fd\u8bf4\u6211\u4eec\u6709\u751f\u4e4b\u5e74\u80af\u5b9a\u7b49\u5f97\u5230\u3002<\/p>\n<p><a href=\"http:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2013-12-20-at-11.28.48-PM.png\"><img loading=\"lazy\" class=\"alignnone size-full wp-image-125\" alt=\"Screen Shot 2013-12-20 at 11.28.48 PM\" src=\"http:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2013-12-20-at-11.28.48-PM.png\" width=\"1066\" height=\"612\" srcset=\"https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2013-12-20-at-11.28.48-PM.png 1066w, https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2013-12-20-at-11.28.48-PM-300x172.png 300w, https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2013-12-20-at-11.28.48-PM-1024x587.png 1024w, https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2013-12-20-at-11.28.48-PM-200x114.png 200w\" sizes=\"(max-width: 1066px) 100vw, 1066px\" \/><\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u8fd9\u7bc7\u300a<a href=\"http:\/\/www.hightopo.com\/blog\/95.html\">\u57fa\u4e8eHTML5\u7684\u7535\u4fe1\u7f51\u7ba13D\u673a\u623f\u76d1\u63a7\u5e94\u7528<\/a>\u300b\u57fa\u4e8eWebGL\u6280\u672f\u7684\u5e94\u7528\u8ba9\u5c11\u540c\u5b66\u5bf9HTML5\u7684\u5e94\u7528\u4ea7\u751f\u4e86\u5174\u8da3\u548c\u4fe1\u5fc3\uff0c\u4f46\u6709\u4e0d\u5c11\u7f51\u53cb\u79c1\u4fe1\u8be2\u95eeWebGL\u5982\u4f55\u8fd0\u884c\u5728\u8001\u7684IE678910\u6d4f\u89c8\u5668\u7684\u95ee\u9898\uff0c\u6bd5\u7adf\u4f5c\u4e3a\u4f01\u4e1a\u5e94\u7528\uff0c\u7528\u6237\u7684\u673a\u5668\u8fd0\u884c\u7740\u5404\u5f0f\u5404\u6837\u7684\u529e\u516c\u53ca\u4e1a\u52a1\u7cfb\u7edf\uff0c\u6709PB\/Delphi\u4e4b\u7c7b\u7684\u8001CS\u5e94\u7528\uff0c\u6709\u5b89\u88c5\u4e86dll\u548cActiveX\u7684\u5404\u79cd\u5b89\u5168\u8ba4\u8bc1\u548c\u89c6\u9891\u76d1\u63a7\u7684\u63d2\u4ef6\uff0c\u6709\u88c5\u7740flash\u6216svg\u63d2\u4ef6\u7684flex\u548cSVG\u5e94\u7528\uff0c\u5f53\u7136\u8fd8\u6709\u652f\u6301IE6\u5374\u4e0d\u652f\u6301\u4efb\u4f55\u975eIE\u6d4f\u89c8\u5668\u7684\u5404\u79cdOA\u529e\u516c\u8f6f\u4ef6\uff0c\u773c\u770b\u7740XP\u64cd\u4f5c\u7cfb\u7edf\u5373\u5c06\u5bff\u7ec8\u6b63\u5bdd\uff0c\u7ed3\u679c\u8fd8\u6210\u4e86\u56fd\u5185\u5404\u5bb6\u5b89\u5168\u516c\u53f8\u7684\u65b0\u5546\u673a\u300a<a href=\"http:\/\/tech.sina.com.cn\/z\/weilieXP\/\">\u56f4\u730eXP\uff1a\u8c01\u5728\u7784\u51c6\u5546\u673a<\/a>\u300b\uff0c\u4f60\u8bf4\u5347\u7ea7\u673a\u5668\u7cfb\u7edf\u8c08\u4f55\u5bb9\u6613\uff1f<\/p>\n<p><a href=\"http:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.40.57-PM.png\"><img loading=\"lazy\" class=\"alignnone size-full wp-image-124\" alt=\"Screen Shot 2014-03-10 at 11.40.57 PM\" src=\"http:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.40.57-PM.png\" width=\"1070\" height=\"527\" srcset=\"https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.40.57-PM.png 1070w, https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.40.57-PM-300x147.png 300w, https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.40.57-PM-1024x504.png 1024w, https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.40.57-PM-200x98.png 200w\" sizes=\"(max-width: 1070px) 100vw, 1070px\" \/><\/a><\/p>\n<p>\u5bf9\u4e8e\u6211\u4eec\u65e0\u529b\u8981\u6c42\u5347\u7ea7\u7684IE678910\u4e0a\u8981\u8dd1WebGL\uff0c\u6211\u4eec\u53ea\u80fd\u91c7\u7528<a href=\"http:\/\/www.chromium.org\/developers\/how-tos\/chrome-frame-getting-started\/chrome-frame-faq#TOC-For-Developers\">Google Chrome Frame<\/a>\u7684\u89e3\u51b3\u65b9\u6848\uff0c\u867d\u7136\u8be5\u63d2\u4ef6Google\u4ece2014\u5e741\u6708\u4efd\u8d77\u5c31\u4e0d\u518d\u7ef4\u62a4\u66f4\u65b0\u4e86\uff0c\u4f46\u5df2\u7ecf\u53d1\u5e03\u7684\u7248\u672c\u4e5f\u662f31\u4e86\uff0c\u8fd9\u4e2a\u7248\u672c\u7684WebGL\u529f\u80fd\u5df2\u7ecf\u8db3\u591f\u5b8c\u5584\u4e86\uff0c\u5f53\u7136\u8fd9\u6837\u7684\u89e3\u51b3\u65b9\u6848\u4e5f\u4e00\u7bad\u53cc\u96d5\u7684\u89e3\u51b3\u4e862D\u7684Canvas\u95ee\u9898\u3002<\/p>\n<p>\u5b89\u88c5\u5b8c\u8be5\u63d2\u4ef6\u540e\uff0c\u5728\u4f60\u9700\u8981\u91c7\u7528WebGL\u7684\u9875\u9762\u589e\u52a0\u4e00\u884c&lt;meta http-equiv=&#8221;X-UA-Compatible&#8221; content=&#8221;chrome=1&#8243;&gt;\u4ee3\u7801\u5373\u53ef\uff0c\u6216\u8005\u4ece\u670d\u52a1\u5668\u4e0b\u53d1\u8be5\u9875\u9762\u662f\u5bf9HTTP\u5934\u589e\u52a0X-UA-Compatible: chrome=1\u7684\u53c2\u6570\u5373\u53ef\u3002<\/p>\n<p>\u4f7f\u7528<code>Google Chrome Frame<\/code>\u8fd8\u9700\u8981\u6ce8\u610f\u4e00\u4e0b\u51e0\u70b9\uff1a<\/p>\n<ul>\n<li><code>Google Chrome Frame<\/code>\u4e0d\u652f\u6301\u76f4\u63a5\u4ece\u672c\u5730<code>local file<\/code>\u65b9\u5f0f\u6253\u5f00\u9875\u9762\uff0c\u5fc5\u987b\u628a\u9875\u9762\u90e8\u7f72\u5230<code>Web<\/code>\u670d\u52a1\u5668\u53d1\u5e03\u65b9\u5f0f\u6253\u5f00\u624d\u80fd\u8fd0\u884c\u51fa\u6548\u679c<\/li>\n<li><code>Google Chrome Frame<\/code>\u4e0d\u652f\u630164\u4f4d\u7684\u673a\u5668\uff1a<a href=\"http:\/\/www.chromium.org\/developers\/how-tos\/chrome-frame-getting-started\/chrome-frame-faq#TOC-Does-Google-Chrome-Frame-work-on-64-bit-IE-\">Currently, 64-bit versions of IE are not supported. It&#8217;s worth pointing out that 32-bit IE is the default on 64-bit Windows 7.<\/a><\/li>\n<li><code>Google Chrome Frame<\/code>\u4e0d\u652f\u6301<code>iframe<\/code>\u65b9\u5f0f\uff1a\u00a0<a href=\"http:\/\/stackoverflow.com\/questions\/2465322\/opening-an-iframe-for-ie-while-using-chrome-frame\">At this point ChromeFrame only supports the meta tag detection on top level URLs.<br \/>\n<\/a><\/li>\n<\/ul>\n<p><span style=\"line-height: 1.5em;\">\u53ef\u91c7\u7528\u5d4c\u5165<\/span><code style=\"line-height: 1.5em;\">OBJECT<\/code><span style=\"line-height: 1.5em;\">\u5143\u7d20\u7684<\/span><a style=\"line-height: 1.5em;\" href=\"http:\/\/src.chromium.org\/viewvc\/chrome\/trunk\/src\/chrome_frame\/host.html\">\u89e3\u51b3\u65b9\u6848<\/a><span style=\"line-height: 1.5em;\">\uff0c\u7ed5\u5f00<\/span><code style=\"line-height: 1.5em;\">Google Chrome Frame<\/code><span style=\"line-height: 1.5em;\">\u4e0d\u652f\u6301<\/span><code style=\"line-height: 1.5em;\">iframe<\/code><span style=\"line-height: 1.5em;\">\u7684\u95ee\u9898<\/span><\/p>\n<pre><code>&lt;OBJECT ID=\"ChromeFrame\" WIDTH=500 HEIGHT=500 CODEBASE=\"http:\/\/www.google.com\"\r\n        CLASSID=\"CLSID:E0A900DF-9611-4446-86BD-4B1D47E7DB2A\"&gt;\r\n    &lt;PARAM NAME=\"src\" VALUE=\"http:\/\/www.google.com\"&gt;\r\n    &lt;embed ID=\"ChromeFramePlugin\" WIDTH=500 HEIGHT=500 NAME=\"ChromeFrame\"\r\n        SRC=\"http:\/\/www.google.com\" TYPE=\"application\/chromeframe\"&gt;\r\n    &lt;\/embed&gt;\r\n&lt;\/OBJECT&gt;\r\n<\/code><\/pre>\n<p>\u4ee5\u4e0a\u662f\u6211\u4f7f\u7528Google Chrome Frame\u89e3\u51b3\u8001IE\u6d4f\u89c8\u5668\u9047\u5230\u7684\u4e00\u4e9b\u5751\u7684\u89e3\u51b3\u65b9\u6848\uff0c\u5982\u679c\u4f60\u8fd8\u9047\u5230\u5176\u4ed6\u95ee\u9898\u53ef\u53c2\u8003<code>Google Chrome Frame<\/code>\u7684<a href=\"http:\/\/www.chromium.org\/developers\/how-tos\/chrome-frame-getting-started\">Developer Guide<\/a>\u00a0\u548c<a href=\"http:\/\/www.chromium.org\/developers\/diagnostics\/gcf_troubleshooting\">Troubleshooting<\/a>\u00a0\u3002<\/p>\n<p>\u8fd8\u597d\uff0c\u6211\u4eec\u9047\u5230\u7684\u4e0d\u5c11\u9879\u76ee\u8fd8\u662f\u5141\u8bb8\u8d2d\u4e70\u65b0\u673a\u5668\u6216\u8005\u5347\u7ea7\u65b0\u6d4f\u89c8\u5668\u7cfb\u7edf\u7684\uff0c\u4f46\u8fd9\u5e76\u4e0d\u4ee5\u4e3a\u8fd9\u80fd\u4e0aIE11\u5c31\u95ee\u9898\u7ed3\u675f\u4e86\uff0c\u5fae\u8f6f\u8fd9\u54e5\u4eec\u5bf9\u65b0\u6807\u51c6\u7684\u652f\u6301\u8981\u561b\u843d\u540e\u534a\u62cd\uff0c\u8981\u561b\u660e\u77e5\u6807\u51c6\u5c31\u8fd9\u6837\u6211TMD\u7684\u5c31\u4e0d\u5b9e\u73b0\u4f60\u80fd\u548b\u5730\uff0c\u76f8\u4fe1preserve-3d\u7684CSS3\u529f\u80fd\u8ba9\u591a\u5c11\u4eba\u6b23\u559c\u8bfa\u72c2\uff0c\u7684\u786e\u5982\u679cCSS3\u76843D\u529f\u80fd\u5404\u5bb6\u6d4f\u89c8\u5668\u80fd\u597d\u597d\u5b9e\u73b0\u5f88\u591a\u5e94\u7528\u4e5f\u5c31\u6ca1WebGL\u5565\u4e8b\u4e86\uff0c\u4f8b\u5982\u8457\u540d\u7684<a href=\"http:\/\/www.famo.us\/\">famo.us\u00a0<\/a>\u7684\u7ecf\u5178\u5143\u7d20\u5468\u671f\u8868\u4f8b\u5b50\uff0c\u5c3c\u739b\u7684IE\u4f7f\u7528\u8005\u5c31\u65e0\u798f\u4eab\u53d7\uff0c\u770b\u770b\u4ee5\u4e0bMS\u4eba\u7684\u8bdd\uff0c\u6211\u77e5\u9053preserve-3d\u662fw3c\u6807\u51c6\uff0c\u8001\u5b50\u5c31\u4e0d\u5b9e\u73b0\uff0c\u60f3\u7528\u7684\u81ea\u5df1\u641e\u8e69\u811a\u7684\u89e3\u51b3\u65b9\u6848\u7ed5\u9053\uff1a<\/p>\n<p><a href=\"http:\/\/msdn.microsoft.com\/en-us\/library\/ie\/hh673529(v=vs.85).aspx\">http:\/\/msdn.microsoft.com\/en-us\/library\/ie\/hh673529(v=vs.85).aspx<\/a><br \/>\nNote The W3C specification defines a keyword value of preserve-3d for this property, which indicates that flattening is not performed. At this time, Internet Explorer 10 does not support the preserve-3d keyword. You can work around this by manually applying the parent element&#8217;s transform to each of the child elements in addition to the child element&#8217;s normal transform.<\/p>\n<p><a href=\"http:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.44.25-PM.png\"><img loading=\"lazy\" class=\"alignnone size-full wp-image-127\" alt=\"Screen Shot 2014-03-10 at 11.44.25 PM\" src=\"http:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.44.25-PM.png\" width=\"768\" height=\"573\" srcset=\"https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.44.25-PM.png 768w, https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.44.25-PM-300x223.png 300w, https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2014-03-10-at-11.44.25-PM-200x149.png 200w\" sizes=\"(max-width: 768px) 100vw, 768px\" \/><\/a><\/p>\n<p>CSS3\u7684\u95ee\u9898\u4e0b\u56de\u518d\u626f\u6de1\uff0c\u90a3\u662f\u4e2a\u65e0\u7a77\u65e0\u5c3d\u7684\u8bdd\u9898\uff0c\u56de\u5230\u6211\u4eec\u7684\u53f7\u79f0\u652f\u6301WebGL\u7684IE11\uff0c\u81f3\u4ece\u4e00\u5e74\u524d\u6709\u4eba<a href=\"http:\/\/www.theverge.com\/2013\/3\/30\/4165204\/microsoft-bringing-webgl-support-internet-explorer-11-windows-blue\">\u6cc4\u9732IE11\u5c06\u652f\u6301WebGL<\/a>\u5c31\u5f15\u5f97\u4e1a\u754c\u4e00\u7247\u5174\u594b\uff0c\u5343\u547c\u4e07\u5524\u59cb\u51fa\u6765\u540e\u5c45\u7136\u8fd8\u6709\u90a3\u4e48\u591a\u7f3a\u9677\uff0c\u4f46\u7ec8\u5f52\u8fd8\u662f\u5927\u597d\u4e8b\uff0c\u8fc8\u51fa\u7b2c\u4e00\u6b65\u662f\u6700\u96be\u7684\uff0c\u76f8\u4fe1\u5fae\u8f6f\u4f1a\u6162\u6162\u5b8c\u5584\uff0c\u4f46\u6bd5\u7adf\u6d3b\u5728\u5f53\u4e0b\u7684\u6211\u4eec\u8fd8\u5f97\u7ee7\u7eed\u586bShading Language\u4e0a\u7684\u51e0\u4e2a\u5751\uff1a<\/p>\n<p>1\u3001lineWidth\u4e0d\u8ba9\u8bbe\u7f6e\uff0c\u53ea\u652f\u63011\u4e2a\u50cf\u7d20\u7684\u8fde\u7ebf\uff0c\u53ea\u80fd\u7528\u4e00\u4e2a\u50cf\u7d20\u5c06\u5c31\u7740\uff0c\u6216\u8005\u628a\u7ebf\u91c7\u7528\u6784\u5efa\u6a21\u578b\u7684\u91cd\u65b9\u5f0f\u6765\u66ff\u4ee3<\/p>\n<p>2\u3001Stencil buffers\u8fd8\u4e0d\u652f\u6301\uff0cclearStencil\u4e4b\u7c7b\u7684\u51fd\u6570\u5c31\u4e0d\u8981\u8003\u8651\u7528\u4e86<\/p>\n<p>3\u3001TRIANGLE_FAN\u7c7b\u578b\u4e0d\u652f\u6301\uff0c\u8fd9\u4e2a\u8fd8\u597d\u529e\uff0c\u6539\u7528TRIANGLES\u66ff\u4ee3\u9876\u591a\u589e\u52a0\u70b9\u9876\u70b9\u6570\u636e<\/p>\n<p>4\u3001\u4e0d\u652f\u6301return\u8bed\u53e5\uff0c\u4f60\u59b9\u7684\u8fd9\u4e2a\u95ee\u9898\u8ba9\u6211\u82e6\u82e6\u627e\u4e86\u534a\u5929\u624d\u53d1\u73b0\uff0c\u53ea\u80fd\u6539\u53d8\u4ee3\u7801\u903b\u8f91\u4e0d\u7528return\u7684\u65b9\u5f0f<\/p>\n<p>\u76ee\u524d\u6211\u9047\u5230\u7684\u5c31\u8fd9\u4e9b\u5751\u4e86\uff0c\u6709\u6454\u5012\u5728\u5176\u4ed6\u5751\u7684\u540c\u5b66\u53ef\u4ee5\u7ee7\u7eed\u8865\u5145\uff0c\u91c7\u7528<a href=\"http:\/\/threejs.org\/\">threejs<\/a>\uff0c<a href=\"http:\/\/blogs.msdn.com\/b\/eternalcoding\/archive\/2013\/06\/27\/babylon-js-a-complete-javascript-framework-for-building-3d-games-with-html-5-and-webgl.aspx\">babylonjs<\/a>\u548c<a href=\"http:\/\/www.hightopo.com\/\">Hightopo<\/a>\u7b493D\u5f15\u64ce\u5c01\u88c5\u7684\u6846\u67b6\u81ea\u7136\u90fd\u4f1a\u5e2e\u6211\u4eec\u5e94\u7528\u5c42\u5c4f\u853d\u8fd9\u4e9b\u5751\uff0c\u4f46\u76f8\u4fe1\u5f88\u591a\u5f15\u64ce\u5e76\u8fd8\u672a\u5bf9IE11\u505a\u8003\u8651\uff0c\u6bd5\u7adf\u8fd9\u54e5\u4eec\u5e02\u573a\u5360\u6709\u7387\u8fd8\u4e0d\u9ad8\uff0c\u7b49\u8db3\u591f\u9ad8\u4e86\u503c\u5f97\u8003\u8651\u65f6\u4e5f\u8bb8\u5fae\u8f6f\u81ea\u5df1\u5df2\u7ecf\u586b\u8865\u597d\u4e86\u5751\uff0c\u65e0\u9700\u6211\u4eec\u518d\u64cd\u5fc3\u4e86\uff0c\u4f46\u5df2\u5fae\u8f6f\u53d1\u5e03\u65b0\u6d4f\u89c8\u5668\u7248\u672c\u7684\u8282\u594f\uff0c\u6211\u53ea\u80fd\u8bf4\u6211\u4eec\u6709\u751f\u4e4b\u5e74\u80af\u5b9a\u7b49\u5f97\u5230\u3002<\/p>\n<p><a href=\"http:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2013-12-20-at-11.28.48-PM.png\"><img loading=\"lazy\" class=\"alignnone size-full wp-image-125\" alt=\"Screen Shot 2013-12-20 at 11.28.48 PM\" src=\"http:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2013-12-20-at-11.28.48-PM.png\" width=\"1066\" height=\"612\" srcset=\"https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2013-12-20-at-11.28.48-PM.png 1066w, https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2013-12-20-at-11.28.48-PM-300x172.png 300w, https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2013-12-20-at-11.28.48-PM-1024x587.png 1024w, https:\/\/www.hightopo.com\/blog\/wp-content\/uploads\/2014\/03\/Screen-Shot-2013-12-20-at-11.28.48-PM-200x114.png 200w\" sizes=\"(max-width: 1066px) 100vw, 1066px\" \/><\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[1],"tags":[],"_links":{"self":[{"href":"https:\/\/www.hightopo.com\/blog\/wp-json\/wp\/v2\/posts\/121"}],"collection":[{"href":"https:\/\/www.hightopo.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hightopo.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hightopo.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hightopo.com\/blog\/wp-json\/wp\/v2\/comments?post=121"}],"version-history":[{"count":5,"href":"https:\/\/www.hightopo.com\/blog\/wp-json\/wp\/v2\/posts\/121\/revisions"}],"predecessor-version":[{"id":129,"href":"https:\/\/www.hightopo.com\/blog\/wp-json\/wp\/v2\/posts\/121\/revisions\/129"}],"wp:attachment":[{"href":"https:\/\/www.hightopo.com\/blog\/wp-json\/wp\/v2\/media?parent=121"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hightopo.com\/blog\/wp-json\/wp\/v2\/categories?post=121"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hightopo.com\/blog\/wp-json\/wp\/v2\/tags?post=121"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}