前言

之前的工作相当于是搭建好了摄影棚(详情请看three.js笔记(1)入门),这一节则需要邀请各位模特或者演员到镜头前表演了。而这些模特是如何生成的呢,本节就介绍如何用three.js提供的方法来创建物体即我们所说的模特。


创建物体

首先我们来看一段创建物体实例的代码:

/*正方体实例*/
var geometry = new THREE.BoxBufferGeometry( 1, 1, 1 );  //创建一个正方几何体
var material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );  //定义材料性质
var cube = new THREE.Mesh( geometry, material );  //组合几何体和材料性质
scene.add( cube );  //将创建好的几何体加入到场景中
/*棱锥实例*/
var geometry = new THREE.ConeBufferGeometry( 5, 20, 32 );
var material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
var cone = new THREE.Mesh( geometry, material );
scene.add( cone );

由此可见,创建一个物体实例的步骤为

  1. 创建一个几何体实例,并定义几何体的参数(类比选择模特);

  2. 创建材料实例,并定义材料的性质(类比为模特选择服装);

  3. 用几何体实例和材料实例来生成一个物体(类比模特穿好服装);

  4. 将生成的这个物体放入场景中(类比将模特请入影棚);

创建几何实例的方法

参见three.js官方文档

创建材料实例的方法

参见three.js官方文档

生成物体实例的方法

参见three.js官方文档——mesh


现在你可以愉快地绘制各种几何物体啦~

参考文献:
1.three.js官方文档


sushi
135 声望19 粉丝

小目标总是要有的,万一实现了呢^^


引用和评论

0 条评论