three的基本组件

threejs 下载链接：https://www.npmjs.com/package/three

一、场景

3d物体需要一个发挥的空间，场景即为发挥的舞台

thres.js中通过 THREE.Scene() 来创建一个场景

二、相机

拍摄场景，记录场景中的表现

主要分为两类

1.透视相机

符合人们的视觉习惯，具有近大远小的特性

THREE.PerspectiveCamera = function(fov,aspect,near,far)

fov: 视角参数，即图1中的Θ，表示两平面之间的夹角，夹角越小，看到的场景越少。

aspect: 纵横比，图1中视角所看到的场景横截面的宽度与高度之比，比率越大，则看到的场景越宽。

near: 图1中的近平面的距离

far：图1中的远平面的距离

图1（图片来自网络）

2.正投影相机

近处与远处一样大

THREE.OrthographicCamera = function(left,right,top,bottom,near,far)

以相机中心点出发，参数分别对应6个面的偏移量，即相对中心点的距离

图片来自网络

三、渲染器

将场景通过计算描绘在屏幕上

THREE.WebGLRenderer（）

四、几何体

存在于场景中的对象

github示例

示例

呈现效果