场景:
THREE.Scene();
THREE.AxesHelper(20);
相机:
THREE.PerspectiveCamera()// 透视相机
THREE.OrthographicCamera()// 正交相机
渲染器:
THREE.WebGLRenderer() //3D场景渲染
CSS2DRenderer(); // 2D平面渲染(用于网页元素与场景元素绑定)
场景动画: 不限 ,一个无限循环函数
animate() {
// 实时更新动画函数
// this.renderer.render(this.scene, this.camera);
// this.labelRenderer.render(this.scene, this.camera);
window.requestAnimationFrame(() => this.animate());
// this.update();
TWEEN.update();
},
光源:
THREE.AmbientLight(0xaffffff) //场景光
THREE.PointLight(0xa6a6a6, 1, 1000); //点光源
THREE.SpotLight(0xa6a6a6); //聚光灯
操作控件:
this.orbitControls = new OrbitControls(this.camera,this.renderer.domElement ) // 轨道控制器
FlyControls() // 飞行控件
几何体:
THREE.PlaneGeometry(长,宽,高) // 平面
THREE.BoxGeometry(长,宽,高) // 立方体
THREE.CircleGeometry() // 圆
THREE.TextGeometry() // 文字
材质:
THREE.MeshStandardMaterial(
color: 0xa6a6a6, // 颜色
side: THREE.BackSide // 反向贴图
visible: false, // 显示隐藏
) //标准材质定时器:
THREE.Clock()
this.orbitControls.addEventListener("change", this.render); // 静态场景优化性能时常用,
物体:
THREE.Mesh() // 网格
THREE.Group() // 组 (场景模型尽量分组,方便管理)
THREE.Line() // 线
THREE.Sprite() // 精灵 (精灵是一个总是面朝着摄像机的平面,通常含有使用一个半透明的纹理。)
模型位置:
Mesh.position.set(x,y,z)
模型缩放:
Mesh.scale.set(1, 1, 1)
分组:
THREE.Group();
追加模型:
scene.add(Mesh) 追加到场景
group.add(mesh) 追加到分组
删除模型:
obj.geometry.dispose();
obj.material.dispose();
scene.remove(obj);
模型/分组查找:
场景/分组.traverse() 遍历
scene.getObjectById() ID 查找
scene.getObjectByName() 名称查找