FoliMesh

适用于three.js的低多边形风格岩石

鹅卵石、石头、巨石、岩板、碎石堆、悬崖和带巨石的悬崖共 7 个模型,均以 GLB 提供,含 LOD0–LOD3、碰撞体与位于底部的轴心,放到地形上无需调整变换。用 three/addons 里的 GLTFLoader 加载,再用 lod.addLevel(mesh, distance) 把各级模型交给 THREE.LOD,逐帧按相机距离切换。

棱面效果来自平面着色和顶点色(COLOR_0):没有贴图、不用展 UV,也没有 alpha 测试。一个乘以顶点色的材质就能覆盖全部岩石,所以 InstancedMesh 或 BatchedMesh 可以一次调用铺满整片碎石坡。LOD0 通常只有几百到两千个三角面,在移动 GPU 上跑 WebGLRenderer 或 WebGPURenderer 都很轻松。碰撞体保持隐藏,交给 Rapier 或 cannon-es。

模型
7
细节层级
LOD0 – LOD3
格式
GLB · FBX · OBJ

关于低多边形风格

低多边形是渲染成本和包体体积都最低的风格。

  • 平面着色:每个面一个法线,呈现清晰的多面体效果,不需要法线贴图。
  • 颜色存储在顶点色(glTF COLOR_0)中:没有贴图、无需处理 UV,几乎不占显存。
  • 树叶是实体几何,而不是 Alpha 面片:没有 Alpha 测试和透明 overdraw,这对移动 GPU 很重要。
  • 场景中所有模型可以共用一个材质,树木很容易合批和实例化。
  • LOD0 的常见预算从几百到两千左右个三角形。

适合移动端、WebGL/WebGPU、VR、策略、城市建造和风格化独立游戏。在引擎中请使用会乘以顶点色的材质。

在three.js中使用

在 three.js 中,用 three/addons 里的 GLTFLoader 加载 GLB;只有当文件使用相应扩展时才需要 DRACOLoader 或 KTX2Loader。

  • 距离 LOD:使用 THREE.LOD,通过 lod.addLevel(mesh, distance) 添加 LOD0–LOD3,每帧根据与相机的距离切换级别。
  • 森林:InstancedMesh 一次 Draw Call 即可绘制成千上万个副本,BatchedMesh 可混合多种树木变体。THREE.LOD 不会作用于单个实例,需要自己按区块将实例按 LOD 分组。
  • 树叶:glTF 的 alphaMode MASK 会转换为 material.alphaTest,双面材质会自动设置 side: THREE.DoubleSide。
  • 碰撞网格:设为不可见,并交给 Rapier 或 cannon-es 等物理库使用。

同时适用于 WebGLRenderer 和 WebGPURenderer。

资源包

其他类别

其他风格的同款

其他引擎的同款