用途
本技能用于在 Three.js 中创建和管理几何体(Geometry),包括使用内置形状、构建自定义 BufferGeometry、处理顶点数据以及通过实例化高效渲染大量相同对象。适用于需要创建 3D 形状、操作顶点、构建自定义几何体或优化大量重复对象的场景。
主要能力
内置几何体
提供多种开箱即用的形状:
- 基础形状:BoxGeometry、SphereGeometry、PlaneGeometry、CircleGeometry、CylinderGeometry、ConeGeometry、TorusGeometry、TorusKnotGeometry、RingGeometry。
- 高级形状:CapsuleGeometry、DodecahedronGeometry、IcosahedronGeometry、OctahedronGeometry、TetrahedronGeometry、PolyhedronGeometry。
- 路径类形状:LatheGeometry(旋转体)、ExtrudeGeometry(挤出)、TubeGeometry(管道)。
- 文本几何体:通过 FontLoader 与 TextGeometry 加载字体并生成 3D 文字。
BufferGeometry
所有几何体的基类,以类型化数组存储数据以提升 GPU 效率。支持:
- 自定义顶点、索引、法线、UV、顶点颜色等属性。
- 多种 BufferAttribute 类型(Float32Array、Uint16Array、Uint32Array、Uint8Array)。
- 修改顶点数据并标记 needsUpdate,重新计算法线、包围盒与包围球。
- 交错缓冲区(InterleavedBuffer)以优化内存布局。
边线与线框
- EdgesGeometry:仅生成硬边线条。
- WireframeGeometry:生成所有三角形的线框。
点与线
- Points:创建点云,支持尺寸衰减。
- Line、LineLoop、LineSegments:创建连线、闭合环与线段对。
实例化
- InstancedMesh:高效渲染大量相同几何体副本,支持逐实例变换与颜色。
- InstancedBufferGeometry:支持自定义逐实例属性,可在着色器中使用。
几何体工具
通过 BufferGeometryUtils 提供:
- mergeGeometries:合并几何体(可带分组以支持多材质)。
- computeTangents:计算切线(法线贴图所需)。
- interleaveAttributes:交错属性以提升性能。
常用模式
- 居中几何体、缩放适配、克隆与变换。
- 变形目标(Morph Targets)实现形状混合。
使用方式
通过 import 引入 Three.js 及所需模块。内置几何体直接实例化后与材质组合成 Mesh 加入场景。自定义几何体通过 BufferGeometry 设置属性。实例化使用 InstancedMesh 并设置每个实例的矩阵。文本几何体需先加载字体文件。
适用场景
- 创建各类 3D 形状与模型。
- 需要精细控制顶点数据的自定义几何体。
- 大量重复对象的高效渲染(如粒子、森林、人群)。
- 3D 文字、旋转体、挤出形状等特殊几何体。
限制
- 合并几何体要求各几何体具有相同属性。
- 索引使用 Uint16Array 时顶点数上限为 65535,更大网格需用 Uint32Array。
- 修改顶点位置后需重新计算法线以保证光照正确。
- 不再使用的几何体应调用 dispose() 释放资源。
- 分段数越高越平滑但性能开销越大,需按需权衡。