three.js-002

Posted 2020-09-25

threejs   三大组件场景（scene）、相机（camera）和渲染器（renderer）。

通过这3大组件才能将物体渲染到网页中

1.scene-----所有物品的容器

在Threejs中场景就只有一种，用THREE.Scene来表示，要构件一个场景也很简单，只要new一个对象就可以了，代码如下：

var scene = new THREE.Scene();

场景是所有物体的容器，如果要显示一个苹果，就需要将苹果对象加入场景中。

 

2.camera----观察物体的视角

相机决定了场景中那个角度的景色会显示出来。相机就像人的眼睛一样，人站在不同位置，抬头或者低头都能够看到不同的景色。

场景只有一种，但是相机却又很多种。和现实中一样，不同的相机确定了呈相的各个方面。比如有的相机适合人像，有的相机适合风景，专业的摄影师根据实际用途不一样，选择不同的相机。对程序员来说，只要设置不同的相机参数，就能够让相机产生不一样的效果。

在Threejs中有多种相机，这里介绍两种，它们是：

透视相机（THREE.PerspectiveCamera）

3.renderer----绘制在哪，怎样的方式

渲染器决定了渲染的结果应该画在页面的什么元素上面，并且以怎样的方式来绘制。