使用 javascript 的 3d 立方体形状

Question

I got this code from webgl I have used it same as they mentioned in their tutorial but i cannot get result on my browser screen only i can see is just black background nothing else.我从 webgl 获得了这段代码，我使用的与他们在教程中提到的相同，但我无法在浏览器屏幕上获得结果，只能看到只有黑色背景。 i have used three.js library to create 3d model of cube.我使用了 Three.js 库来创建立方体的 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>

Answer 1

Is this your full code?这是你的完整代码吗？ I think it would be helpful if you posted the full HTML context of what you're trying to achieve.我认为如果您发布您要实现的目标的完整 HTML 上下文会有所帮助。

However, what I see at first blink, is that you either don't add the rendering target to your HTML page, or you don't use the canvas you have in your HTML to render to.但是，我第一眼看到的是，您要么不将呈现目标添加到 HTML 页面，要么不使用 HTML 中的画布进行呈现。

The easiest way to get your cube displayed, is by adding the rendering canvas to your page's DOM, with: document.body.appendChild( renderer.domElement );显示多维数据集的最简单方法是将渲染画布添加到页面的 DOM 中，使用： document.body.appendChild( renderer.domElement );

使用 javascript 的 3d 立方体形状

问题描述

1 个解决方案

解决方案1
5 已采纳 2017-04-10 15:53:40

使用 javascript 的 3d 立方体形状

问题描述

1 个解决方案

解决方案1 5 已采纳 2017-04-10 15:53:40

解决方案1
5 已采纳 2017-04-10 15:53:40