1,创建场景对象:var scene = new THREE.Scene();
2,创建几何体:var geometry = new THREE.BoxGeometry(100, 100, 100);注:有多种几何体的创建函数,也可以通过自定义的几何体加入到场景中,通过BufferGeometry和BufferAttribute实现,具体的实现参考官方文档。
3,创建材质:var material = new THREE.MeshLambertMaterial({ color: 0x0000ff });
4,创建网格模型对象:var mesh = new THREE.Mesh(geometry, material); 注:mesh函数两个参数是几何体对象和材质对象,如此就很好记忆了。
5,网格模型对象加入到场景:scene.add(mesh); 注:这样就很清楚了,创建场景,创建几何体和材质,然后根据几何体和材质创建网格模型对象,最后加入到场景就完成了一个模型的基本装配。
6,点光源和环境光的设置:
7,相机设置:
8,创建渲染器并且执行渲染:代码把canvas插入到body中的,加入是要插入到div中修改dom节点再append就可以了。
9,监听鼠标事件:如果定义的旋转动画下面那行监听事件的代码要删掉。
10,旋转动画:
|