如何將THREE.js旋轉球從Canvas更改爲WebGL？

您好我下載了three.js所全球從這個鏈接： http://threejs.org/examples/#canvas_geometry_earth 如何將THREE.js旋轉球從Canvas更改爲WebGL？

現在我想這整個項目從CanvasRenderer改變WebGLRenderer因爲WebGL的負載更有效地細分和設置背景圖片可以使用CSS。在我下載的項目，我改變了這行代碼：

renderer = new THREE.CanvasRenderer();

要這樣：

renderer = new THREE.WebGLRenderer();

但這樣做在全球和整個場景消失了，所有我留下的是一片空白頁。如何成功將項目更改爲WebGL。

來源

2014-07-21 user3860127

在three.js r67與鉻36.0.1985.125我得到相同的結果，無論我使用哪個渲染器。當您打開JavaScript控制檯時，是否會收到日誌消息「THREE.WebGLRenderer 67」？ – gaitat

就試了一下使用r.68，完全改變的建議：

@@ -105,11 +105,11 @@ 
      var mesh = new THREE.Mesh(geometry, material); 
      mesh.position.y = - 250; 
      mesh.rotation.x = - Math.PI/2; 
      group.add(mesh); 

-   renderer = new THREE.CanvasRenderer(); 
+   renderer = new THREE.WebGLRenderer(); 
      renderer.setClearColor(0xffffff); 
      renderer.setSize(window.innerWidth, window.innerHeight); 

      container.appendChild(renderer.domElement);

工作正常，我用Firefox。使用Chrome它不起作用，但它不是Three.js的錯。如果你檢查你的Web控制檯，你會發現類似的錯誤：

Uncaught SecurityError: Failed to execute 'texImage2D' on 'WebGLRenderingContext': The cross-origin image at file:///D:/Temp/three.js/examples/textures/land_ocean_ice_cloud_2048.jpg may not be loaded.

應該有，你可以用它來啓動Chrome會繞過這個安全限制，雖然我不能輕易找到它叫什麼命令行選項。另外，建議不要使用啓用的瀏覽器。如果你可以把例子放在一個Web服務器上，你也不應該有這個問題。

來源

2014-07-21 18:25:03 Leeft

如何將THREE.js旋轉球從Canvas更改爲WebGL？

回答

相關問題