THREE.JS之照像机（Camera）

最新推荐文章于 2024-05-20 08:47:19 发布

天涯苍狗

最新推荐文章于 2024-05-20 08:47:19 发布

阅读量1.3k

点赞数 1

分类专栏： three.js系列文章标签： web 3D threejs webgl

本文链接：https://blog.csdn.net/u011135260/article/details/100831732

版权

在简介的章节中，我介绍过照相机在3D的世界中的作用，照像机之于场景，就像天文望远镜之于宇宙。天文望远镜能看到什么东西，我们才能看到什么东西。所以照像机在3D有着非常重要的地位，这一章我们来介绍一下Three.js中的照像机,包括透视相机（PerspectiveCamera），正交相机（OrthographicCamera），立方体相机（CubeCamera）和立体相机（StereoCamera）。

透视相机（PerspectiveCamera）
透视相机应该是使用最多的一类照相机了，因为这类摄像机成像的原理和我们人眼看东西是一样的—近大远小。在简介章节中，我们就是用透视相机来观察我们创建的第一个场景，观察到了第一个方块。具体的使用方法如下：

var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
sence.add(camera);

我们需要给透视相机传进去四个参数：

fov(视野)：照相机拍摄范围的一个角度。角度越大，视野就越宽。就好比普通相机和广角相机一样，广角相机拍摄的景物更多。
aspect(纵横比)：相机拍摄的图像的宽高比，一般与画布的宽高比一致；
near(近端距离)：相机只不捉距离它小于这个值的物体；
far(远端距离)：相机不捕捉距离它大于这个值的物体；

因为我们说一个场景就是一个宇宙，无边无际，摄像机无论面朝那个方向，根据透视原理，他的视野就是一个锥型一样向外发散，理论上只要在这个锥形中的物体，都应该被照相机捕捉。但是又根据透视原理，远处的物体成像会很小，超出一定距离的物体对于成像来说已经没有意义，为了优化渲染，指定相机只渲染near到far之间的物体。

使用透视相机，可以观察近大远小的效果，代码如下，在这儿查看在线例子：</