three.js所我使用下面的代码来渲染搅拌机模式(默认立方体一个刚开始出来),并没有什么出了不渲染

问题描述:

three.js所我使用下面的代码来渲染搅拌机模式(默认立方体一个刚开始出来),并没有什么出了不渲染

<html> 
    <head> 
     <title>Test page for the </title> 
     <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"> 
    </head> 
    <body> 
     <div id="container"></div> 
     <script src="src/three.min.js"></script> 
     <script src="src/Stats.js"></script> 
     <script> 
     var camera, scene, renderer, loader; 
      init(); 
      render(); 
      function init(){ 

       var container = document.getElementById('container'); 

       camera = new THREE.PerspectiveCamera(10, window.innerWidth/window.innerHeight, 1, 500); 
       camera.position.y = 100; 
       camera.position.z = 100; 

       controls = new THREE.TrackballControls(camera); 

       scene = new THREE.Scene(); 

       loader = new THREE.JSONLoader(); 
       loader.load('obj/one.js', function (geometry){ 
        mesh = new THREE.Mesh(geometry, new THREE.MeshNormalMaterial({overdraw: true})); 
        scene.add(mesh); 
       }); 

       renderer = new THREE.CanvasRenderer(); 
       renderer.setSize(window.innerWidth, window.innerHeight); 
       container.appendChild(renderer.domElement); 

       stats = new Stats(); 
       stats.domElement.style.position = 'absolute'; 
       stats.domElement.style.top = '0px'; 
       container.appendChild(stats.domElement); 

       window.addEventListener('resize', onWindowResize, false); 


      } 

      function render(){ 
       renderer.render(scene, camera); 
       controls.update(); 
       stats.update(); 
      } 

      function onWindowResize() { 

       camera.aspect = window.innerWidth/window.innerHeight; 
       camera.updateProjectionMatrix(); 

       renderer.setSize(window.innerWidth, window.innerHeight); 

      } 

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

一切都被放置在其路径正确,我得到的只是一个空白的屏幕。建议吗?

因为你不是动画。 collada加载器是一个回调函数,因此在初始页面渲染完成后加载完毕,然后将该对象添加到场景中。由于没有动画循环,一旦模型完成加载,页面就不会重绘。