GLB file not displaying correctly in BabylonJS after exporting from Substance Painter

Questions
1

Hi everyone,

I have a 3D model in .fbx format. When I export it to .gltf and load it in BabylonJS, everything displays correctly

Later, I modified the material using Substance Painter and exported the model as .glb. The new .glb file does not display correctly in BabylonJS.

Problem is with the tree branches:
Although the branches are correctly placed inside the leaves in the model, **BabylonJS renders them visibly **, making them appear incorrect:

image
image742Ă—622 52.9 KB

However, it displays just fine on other viewers and they are hidden properly behind the leaves (like glTF Sample Viewer):

image
image1461Ă—1223 46.2 KB

What could be causing this issue?
Is there something I need to change in BabylonJS or in the export settings from Substance Painter?

Any help would be appreciated!

2

No chance to share the model to have a look?
I feel this may be related to negative scaling, but it is only a guess.

3

It could also be because the material is considered as transparent for some reasons.

4

If I remember correctly (or not :zany_face:), at some point had some similar issue from blender, while exporting a material which used an ALBEDO texture with alpha channel (in the node).
So the GLTF material was set to transparent and then there was the sorting issue, which looks like that.
Be sure, that there is no ALPHA (transparency) information (or the correct one) exported into the material.
You can check the file using the INSPECTOR in the sandbox, there u should see the material properites.
So its probably an export or substance painter “feature” rather an babylon one, I guess.

Best. Werner

5

PBR - Metallic Roughness Alpha-blend.zip (3.4 MB)

It renders correctly on the glTF Sample Viewer:

6

The same issue happens in other GLTF/GLB viewers, like https://gltf.report/ or Google Model Editor
I believe the difference in glTF Sample Viewer is related to the depth calculations. You will get the same result if enable depth prepass for the material

image
image1481Ă—847 52.7 KB

The matter is that this is not the most effective solution.
In the GLB file which is exported from Substance 3D Painter the transparency mode for “leaves” material is set to Alpha Blend mode. It also uses alpha from non-transparent texture which is nonsense. To get stable results just change the mode to Opaque and all issues will go away.

image
image1247Ă—714 96.6 KB

Below is the short info about Alpha Blend (Transparency Blending) mode which clearly shows that there is no reason to use this mode for non-transparent objects.

  • What it does :
    • Combines the color of a pixel with the background using its alpha value (0–1).
    • Allows for partial transparency (e.g., glass, smoke, water).
    • Requires rendering objects in back-to-front order (depth sorting).
  • Use Cases :
    • Glass, liquids, or translucent materials.
    • Particle effects (e.g., fire, fog).
  • Pros :
    • Smooth gradients and realistic transparency.
    • Works well for effects requiring depth perception.
  • Cons :
    • Performance overhead (blending requires depth sorting).
    • Artifacts if overlapping transparent objects are not sorted correctly - your case.
2 Likes
7

Thank you labris.

I have another question.

I’m working on creating an environment for a 3D scene and I’m considering the best approach for organizing the models (such as rocks, trees, mountains, etc.).

Would it be better to model all the environment elements in a single file (e.g., combining all assets like rocks, trees, and mountains into one file) and import them into the scene, or is there a more efficient way to structure and manage these assets?