0 
<script>

        var container;
        var camera, scene, renderer;
        var scale = 100, N=1000;
        var arr= [];
        var width = 720, height = 405;


         function average(v)
         {
              var items = v.length;
              var sum = 0.0;
              for (i = 0; i<items; i++)
              sum += v[i];
              return (sum/items);
            }

        start =function()
        {
        init();
        //animate();
        };      

        function init() 
        {

            container = document.getElementById("theCanvas");
            camera = new THREE.PerspectiveCamera( 45, width / height, 0.1, 10000 );
            camera.position.x = 0;
            camera.position.y = 0;
            camera.position.z = 80;
            scene = new THREE.Scene();

            renderer = new THREE.WebGLRenderer({antialias:true});

            renderer.setClearColorHex(0x000000, 1);
            renderer.setSize( width, height );

            container.appendChild( renderer.domElement );

            var geometry = new THREE.CubeGeometry( 1, 1, 1 );

            var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
            for ( var i = 0; i <= N; i++)
            {
                arr.push(new THREE.Mesh( geometry, material ));
                arr[i].position.set( (Math.random()-0.5) * scale, (Math.random()-0.5) * scale, (Math.random()-0.5) * scale ); 
                scene.add( arr[i] );


            }
            animate();
            document.getElementById('3dobjects').innerHTML = "Three.js Demo, The number of Cube Objects: " +N;
            }

        function animate() 
        {
            requestAnimationFrame( animate );
            render();
        }


        function render() 
        {   

            var t = 0;
            var t0 = (new Date()).getTime();
            var fpss = [];
            setInterval(function(){
                renderer.render(scene, camera);
                var t1 = (new Date()).getTime();
                fpss.push(1000/(t1 - t0));
                if(fpss.length>200)
                  fpss.shift();

                if(t%2==0)
                    document.getElementById('fpsout').innerHTML = "FPS coded Myself is: " +average(fpss);   
            t0 = t1;
                t++;
          },1000/60);

        }

为什么 Three.js 应用程序的帧速率在几秒钟后会下降到小数？我在错误的地方调用 fps 计算吗？如果可能的话，有人可以帮助我使用基本着色器程序来渲染没有纹理但颜色的简单立方体。

4

1 回答 1

0

我通过调整 stats.js 并从中访问 FPS 找到了解决方案。

于 2012-11-14T22:14:24.683 回答