FoliMesh

Modelos 3D estilo Realista para three.js

La vegetación realista entra en three.js sin convertir nada: el GLB se carga con GLTFLoader desde three/addons y los materiales PBR metal/rugosidad — corteza con mapas de color base, normal y rugosidad, hojas en tarjetas enmascaradas — se renderizan tal como se armaron. DRACOLoader o KTX2Loader solo se necesitan si el archivo usa esas extensiones. Las mallas LOD0–LOD3 se pasan a THREE.LOD con lod.addLevel(mesh, distance) y el nivel cambia en cada frame según la distancia de la cámara.

De los 42 modelos — Roble, Pino silvestre, Abeto, Abedul, Sauce llorón, Olivo y Cocotero — salen tanto bosques como desiertos. InstancedMesh dibuja los volúmenes grandes y BatchedMesh combina varias especies en un chunk; como THREE.LOD no funciona por instancia, conviene agrupar las instancias por nivel y chunk. La malla de colisión queda invisible y se entrega a Rapier o cannon-es. Sirve para juegos en primera y tercera persona, supervivencia, mundos abiertos y simuladores en PC y consolas; en móviles arranca desde LOD1 o LOD2 y cuida el overdraw de las hojas.

Modelos
42
Niveles de detalle
LOD0 – LOD3
Formatos
GLB · FBX · OBJ

Acerca del estilo Realista

Los modelos realistas usan el flujo PBR metal/roughness, que glTF 2.0, Unity, Unreal, Godot y three.js leen de forma directa.

  • Corteza: mapas de color, normales y rugosidad en el tronco y las ramas.
  • Follaje: tarjetas con alpha test (masked) y texturas de racimos de hojas, no alpha blend: escriben profundidad, no requieren ordenamiento y generan sombras correctas.
  • Corteza y follaje tienen materiales separados, por lo que la cantidad de draw calls es predecible y el instancing por GPU funciona sin problemas.
  • LOD0 es para tomas cercanas; LOD1–LOD3 quitan ramas y tarjetas de hojas, y el último nivel es lo suficientemente liviano para la distancia.

Ideales para juegos en primera y tercera persona, supervivencia, mundos abiertos y simuladores en PC y consola. En celulares, usa LOD1 o LOD2 como nivel más cercano y controla el overdraw del follaje.

Uso en three.js

En three.js, carga el GLB con GLTFLoader de three/addons; agrega DRACOLoader o KTX2Loader solo si un archivo usa esas extensiones.

  • LOD por distancia: THREE.LOD con lod.addLevel(mesh, distance) para LOD0–LOD3; cambia de nivel según la distancia a la cámara en cada cuadro.
  • Bosques: InstancedMesh dibuja miles de copias en un solo draw call y BatchedMesh combina varias variaciones de árboles. THREE.LOD no funciona por instancia, así que agrupa tú las instancias por LOD en cada chunk.
  • Follaje: el alphaMode MASK de glTF se convierte en material.alphaTest y los materiales de doble cara reciben side: THREE.DoubleSide automáticamente.
  • Malla de colisión: déjala invisible y pásala a una biblioteca de física como Rapier o cannon-es.

Funciona tanto con WebGLRenderer como con WebGPURenderer.

Packs

Otras categorías

Lo mismo en otros estilos

Lo mismo para otros motores