Three.js的基础知识二

• Three.js的相机
• Three.js让场景动起来的两种方式
• 性能测试
• 相机的工作原理

Three.js的相机

Three.js让场景动起来的两种方式

1. 变换物体的位置
2. 变换相机的位置
   有一个函数可以不断的绘制场景，不断的调用render来重绘，这个循环就称为渲染循环。

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

性能测试

FPS(Frames Per Second):视频或者动画每秒显示多少帧数。理论上，3D程序最大的帧数是显卡支持的刷新率，一般是60。
stats:一个监控程序 帧数、每帧时间、内存使用量的js库。使用方法可以看readme.md，进行使用。
tweenjs :给 tween 要修改的值、动画结束时的最终值和动画花费时间（duration），之后 tween 引擎就可以计算从开始动画点到结束动画点之间值，从而产生平滑的动画效果。

相机的工作原理

Three.js里共有正投影以及透视投影相机。
正投影相机:THREE.OrthographicCamera(left,right,top,bottom,near,far)其中near指的是相机最小能看到的平面，near指的是相机最远可以看到的平面。
透视相机：THREE.PerspectiveCamera(fov,aspect,near,far)。其中fov指的是视角角度，aspect指的是横宽比，near指的是近平面，far指的是远平面。可以更改相机的fov模拟物体的放大与缩小。
camera.lookat指的是相机的指向的一个方向，lookat指的是一个方向而不是一个点。默认是正z轴看向-z轴。
up类似于相机的快门的位置，即相机的上方的位置。默认是y轴的正方向。
相机的position、up、lookat确定了相机的唯一摆放。

• 点赞
• 收藏
• 分享
• • 文章举报

阿浪啊 发布了15 篇原创文章 · 获赞 1 · 访问量 1304 私信 关注

标签：动画,fov,Three,基础知识,相机,near,js
来源： https://blog.csdn.net/qq_42216823/article/details/100669924