一,组成
scene-主容器
material&texture -贴图
geometry
object
light
renderer&shader
loader
二, 语法
var scene = new THREE.Scene();
var mat = THREE.MeshBasicMaterial({color: 0x60f60f})
var gem = new BoxGeometry()
摄像机
正交投影:等同平行投影
透视投影
其他
blender 软件,3d建模
光源
点光 pointLight
锥形光 spotLight
环境光 AmbientLight
材质
完全不反射 MeshBasicMaterial
漫反射 Lambert
镜面反射 Phong
辅助线
光源辅助线:
var spotLightHelper = new THREE.DirectionalLightHelper( light );
scene.add( spotLightHelper );
坐标系:
var axisHelper = new THREE.AxisHelper(15000);
scene.add(axisHelper);
镜头控制:
orbitControl
容器
new THREE.Group();
new THREE.Object3D();
挤压
THREE.Vector2
2d vector
new THREE.ExtrudeGeometry()
多复制几个门
mesh.clone()
持续前进,循环
镜头、光源、跑道、建筑,猫门;都循环前进。
设置最远比较基线
参考:http://codepen.io/shelbeniskb/pen/dpYRWN
如何调整光源的朝向?(难以打光打成设计稿的样子)
direcLight.target.position.set( 200, -180, 100 ); 无效
lookAt() 也无效
总是tagert是原点
如何使用交互控制栏?
var gui = new dat.GUI()
gui.add({}, name, param1, param2...)
onChange( ... )
如何使用贴图?
加载:var texture = THREE.ImageUtils.loadTexture(data.url)
new THREE.MeshLambertMaterial({ map: texture });