Low-Poly Bodenvegetation für Babylon.js

Bodenvegetation im Stil Low-Poly für Babylon.js

Low-Poly-Bodenvegetation ist das günstigste Element einer Babylon.js-Szene: drei Modelle — Farn, Grasbüschel und Schilf — mit LOD0–LOD3 und Pivot an der Basis, als GLB für den glTF-Loader aus @babylonjs/loaders. Ein einzelnes Modell lädt ImportMeshAsync; braucht der Waldboden hunderte Kopien, sind LoadAssetContainerAsync und instantiateModelsToScene der passende Weg.

Weil die Farbe in Vertexfarben (COLOR_0) steckt und jede Fläche nur eine flach schattierte Normale hat, genügt ein Material für die ganze Auswahl: keine Texturen, keine UV-Arbeit, kaum Videospeicher. Blätter sind Vollgeometrie, also entsteht kein Alpha-Overdraw auf mobilen GPUs. Die LOD-Stufen verbindet lod0.addLODLevel(30, lod1), das Kollisionsmesh bleibt unsichtbar und läuft über checkCollisions oder Havok, und Gras verteilt thinInstanceAdd in einem einzigen Draw Call.

Über den Stil Low-Poly

Low-Poly-Vegetation ist der günstigste Stil – beim Rendern wie bei der Build-Größe.

Flat Shading: eine Normale pro Fläche ergibt den klaren Facetten-Look, Normal Maps entfallen.
Die Farbe liegt in den Vertex-Farben (glTF COLOR_0): keine Texturen, keine UV-Arbeit, kaum Grafikspeicher.
Das Laub ist echte Geometrie statt Alpha-Cards: kein Alpha-Test und kein transparenter Overdraw – wichtig für mobile GPUs.
Ein einziges Material reicht für alle Modelle einer Szene, Bäume lassen sich daher leicht batchen und instanzieren.
Übliche Budgets für LOD0 liegen zwischen einigen hundert und rund zweitausend Dreiecken.

Passt zu Mobile, WebGL/WebGPU, VR, Strategie, Aufbauspielen und stilisierten Indie-Games. In der Engine ein Material verwenden, das mit der Vertex-Farbe multipliziert.

Verwendung in Babylon.js

Babylon.js lädt GLB über den glTF-Loader aus @babylonjs/loaders: ImportMeshAsync (oder SceneLoader.ImportMeshAsync in älterem Code) bzw. LoadAssetContainerAsync, wenn viele Kopien per instantiateModelsToScene nötig sind.

LOD: lod0.addLODLevel(30, lod1), addLODLevel(80, lod2) usw.; null als Mesh blendet das Objekt jenseits dieser Distanz aus.
Tausende Bäume: Thin Instances (thinInstanceAdd mit Matrizen) rendern mit einem Draw Call pro Mesh; normale createInstance nutzen, wenn jeder Baum eigenes Picking oder eigene Logik braucht.
Laub: glTF-MASK wird zu einem alpha-getesteten PBRMaterial (MATERIAL_ALPHATEST).
Kollisionsmesh: isVisible = false setzen und mit checkCollisions oder Havok-Physik (PhysicsAggregate mit MESH-Shape) nutzen.

Bodenvegetation im Stil Low-Poly für Babylon.js

Über den Stil Low-Poly

Verwendung in Babylon.js

Modelle

Farn

Grasbüschel

Schilf

Weitere Kategorien

Dasselbe in anderen Stilen

Dasselbe für andere Engines