0

这是我的代码......我搜索了很多关于它......但我找不到什么都不会显示的问题！也没有任何错误！如果你能帮助我，我也可以把我的文件发给你……谢谢

    <body>
    <script src="Three.js"></script>
    <script src="DDSLoader.js"></script>
    <script src="MTLLoader.js"></script>
    <script src="OBJLoader.js"></script>


    <script>
     // Setup a new scene
     var scene = new THREE.Scene();


     // Setup the camera
    var camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000);
    camera.position.z = 0;
    camera.position.x = 0;
    camera.position.y = 0;
     // Setup the renderer
     var renderer = new THREE.WebGLRenderer();
     renderer.setSize(window.innerWidth, window.innerHeight);
     document.body.appendChild(renderer.domElement);

     var onProgress = function ( xhr ) {
                        if ( xhr.lengthComputable ) {
                            var percentComplete = xhr.loaded / xhr.total * 100;
                            console.log( Math.round(percentComplete, 2) + '% downloaded' );
                        }
                    };
                    var onError = function ( xhr ) { };

                    THREE.Loader.Handlers.add( /\.dds$/i, new THREE.DDSLoader() );

    var mtlLoader = new THREE.MTLLoader();
    mtlLoader.setPath( 'obj/table/' );
    mtlLoader.load( 'table.mtl', function( materials ) {
    materials.preload();
    var objLoader = new THREE.OBJLoader();
    objLoader.setMaterials( materials );
    objLoader.setPath( 'obj/table/' );
    objLoader.load( 'table.obj', function ( object ) {
                object.position.x = 0;
                object.position.y = 0;
                object.position.z = 0;
                scene.add( object );
            }, onProgress, onError );
        });



     // Render loop to rotate our sphere by a little bit each frame
     var render = function () {
         renderer.setClearColor( 0xa9db8b );
       renderer.render(scene, camera);
     };

     render();
     </script>
<canvas width="1366" height="662" style="width: 1366px; height: 662px;"></canvas>
    </body>
4

2 回答 2

0

作为一种选择：您render()在模型加载之前调用。

尝试这个：

objLoader.load( 'table.obj', function ( object ) {
                object.position.x = 0;
                object.position.y = 0;
                object.position.z = 0;
                scene.add( object );
                render();  // call it in the callback function
            }, onProgress, onError );
        });
于 2017-03-27T08:07:14.417 回答
0

您将对象放置在 (0,0,0) 处，并且将相机放置在同一位置。为您的相机尝试以下代码：

// Place camera on x-axis
camera.position.set(10,0,0);
camera.up = new THREE.Vector3(0,0,1);
camera.lookAt(new THREE.Vector3(0,0,0));
于 2017-03-26T23:34:58.090 回答