初学three.js(三)照相机之透视投影照相机

透视投影照相机的结构函数是：

THREE.PerspectiveCamera(fov,aspect,near,far);

上图为透视图，近平面距离和原平面距离之间是可能被渲染的物体的所在区域。a是视景体竖直方向上的张角（有些使用fov表示）。aspect等于width/height，是照相机水平方向和竖直方向长度的比值，这里通常设置为canvas的横纵比例。near和far分别是照相机到视景体的最近和最远的距离，均为正值，而且far>near。

举个例子

代码如下：

canvas {
    width: 100%;
    height: 100%;
    }

     var scene = new THREE.Scene();
     var renderer = new THREE.WebGLRenderer();
     document.body.appendChild(renderer.domElement);
     var camera = new THREE.PerspectiveCamera(45,1,1,10);
     camera.position.set(0,0,5);
     scene.add(camera);
//在原点处设置一个边长为1的正方体
     var cube = new THREE.Mesh(new THREE.CubeGeometry(1,1,1),new THREE.MeshBasicMaterial({color:0xff0000,wireframe:true}));
     scene.add(cube);
     renderer.render(scene, camera);

效果如下图所示

1、竖直张角（fov越大，渲染的物体显示越小）

研究一下fov张角的改变对渲染效果的影响。将原来的45改为80，显示如图所示，正方体变得更小了。原因是：虽然正方体实际的大小并没有变化，但是照相机的竖直张角变大时，视景体变大，因而正方体对于整个视景体来说是相对变小了，所以看起来的正方形就显得变小。注意的是：fov的改变并不会引起画面的横竖比例的变化，而改变aspect才会。（因为aspect=width/height）。

声明：以上内容均参考了three.js开发指南