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 に答える