今天我们来看看第一个程序的基本组件,即创建一个三维场景程序,到底需要哪些东西。
- Scene
var scene= new THREE.Scene();
通过这条语句,我们创建一个场景,可以理解为舞台戏台,不过里面啥都没有。(不可省略)。
- Camera
var camera= new THREE.PerspectiveCamera(45,window.innerWidth/window.innerHeight,0.1,1000);
这条语句类似于创建了一个相机,可以理解为观众,当然里面包含了视角,长宽比,还有位置及你能看多近多远等。
(不可省略)
- Renderer
var renderer= new THREE.WebGLRenderer();
这条语句创建了渲染组件,可以理解为导演,它的作用就是让整个三维场景按照指定规则运行起来。
- Gemometry
var gemometry = new THREE.CubeGeometry(4,4,4);
var material = new THREE.MeshBasicMaterial({color:0x22ff22,wireframe:true});
var cube = new THREE.Mesh(gemometry,material);
这几条语句是创建了一个几何体。可以理解为演员,主角等。看就是看它的表演啦。
第一条语句是告诉我们要创建一个什么样的几何体。
第二条语句是说你打算用什么材料。
第三条语句是包装一下,成了,搞定。
创建结束后,你首先得把演员放到舞台里面,
scene
.
add
(
cube
);
接着导演把所有的东西放入场地,
//把canvas加入到body
document
.
body
.
appendChild
(
renderer
.
domElement
);
接着观众及演员各就各位,最后导演只要说action,好戏就开始了。
renderer
.
render
(
scene
,
camera
);