three.js学习：性能监视器stats.js的用法

2019独角兽企业重金招聘Python工程师标准>>>

用法一：

var stats = new Stats();
stats.setMode(0);
stats.domElement.style.position = 'absolute';
stats.domElement.style.left = '0px';
stats.domElement.style.top = '0px';
document.body.appendChild(stats.domElement);
setInterval(function () {
    stats.begin();
    stats.end();
}, 1000 / 60)

用法二（红字部分）：

var renderer;
var stats = new Stats();
function initThree() {
    stats.setMode(0);
    stats.domElement.style.position = 'absolute';
    stats.domElement.style.left = '0px';
    stats.domElement.style.top = '0px';
    document.body.appendChild(stats.domElement);

    renderer = new THREE.WebGLRenderer({
        canvas: canvas,
        antialias: true
    });
    renderer.setSize(window.innerWidth, window.innerHeight);
    renderer.setClearColor(0xffffff, 1.0);
}
......此处代码省略......

function animation3D() {
    cylinder.position.x -= 0.5;
    renderer.render(scene, camera);
    requestAnimationFrame(animation3D);
    stats.update();
}

requestAnimationFrame(animation3D);

转载于:https://my.oschina.net/u/4108765/blog/3059971