使用javascript的3D立方体形状

问题描述：

我从webgl得到了这段代码我用它和他们的教程中提到的一样，但是我无法在我的浏览器屏幕上得到结果只能看到只是黑色背景而已。我已经使用three.js库来创建立方体的三维模型。使用javascript的3D立方体形状

<pre> 
      <!doctype html> 

      <html> 
     <head> 
     <meta charset="utf-8"> 
     <style> 
     canvas { width: 100%; height: 100% } 
     </style> 
     <title>Pryamid</title> 
     </head> 

<body>

<script> 
var scene = new THREE.Scene(); 
     var camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000); 

     var renderer = new THREE.WebGLRenderer(); 
     renderer.setSize(window.innerWidth, window.innerHeight); 
     document.body.appendChild(renderer.domElement); 

     var cubegeometry = new THREE.CubeGeometry(1,1,1); 
     var cubematerial = new THREE.MeshBasicMaterial({wireframe: true, color: 0x000000}); 

     var cube = new THREE.Mesh(cubegeometry, cubematerial); 

     scene.add(cube); 

     camera.position.z = 5; 

     var render = function() { 
      requestAnimationFrame(render); 

      cube.rotation.y += 0.01; 
      cube.rotation.x += 0.01; 
      cube.rotation.z += 0.01; 

      renderer.render(scene, camera); 
     }; 

     // Calling the render function 
window.onload = function() { 
render(); 
}; 

</script> 
</body> 
</html>

答

这是您的完整的代码？我认为如果您发布了您想要实现的完整HTML上下文会很有帮助。

但是，我第一眼看到的是，您要么不将渲染目标添加到HTML页面，要么不使用HTML中的画布进行渲染。

让你的立方体显示最简单的方法，是通过将所呈现的画布到你的页面的DOM，有：

我没有得到你，我是新手用JavaScript和我后期编辑HTML和我忘了提到我用three.js库 –

现在还在工作？还是它解决了它？ – Alex

使用javascript的3D立方体形状

相关推荐