threejs:让场景动起来的两种方法
1.变化物体的位置。不断循环animation函数,同时让物体在x方向位置增加。
function animation()
{
mesh.position.x +=0.1;
renderer.render(scene, camera);
requestAnimationFrame(animation);
}
2.变化相机的位置。不断循环animation函数,同时让相机朝着x正方向移动,那么物体就会向着反方向移动了。
function animation(){
camera.position.x += 1;
renderer.render(scene,camera);
requestAnimationFrame(animation);
}
3.帧数监控。帧数监控用的是stats.js包。使用比较简单,如下,先创建一个stats对象,然后在需要监控的代码段使用stats.begin和stats.end监控就可以了。
3.1 创建一个stats对象
var stats;
stats = new Stats();
stats.domElement.style.position = 'absolute';
stats.domElement.style.left = '0px';
stats.domElement.style.top = '0px';
document.getElementById('canvas-frame').appendChild(stats.domElement);
3.2 引用
function animation()
{
stats.begin();
mesh.position.x +=0.1;
renderer.render(scene, camera);
requestAnimationFrame(animation);
stats.end();
}

浙公网安备 33010602011771号