Issue with rendering occlusion of node materials

Hi, I’m sorry if this has been asked before, but I wasn’t able to find a solution.

difficult one to describe, but I have a playground:

when I zoom in and out using the mousewheel, the materials of the clouds (ground mesh), and sky sphere render irregularly. When the camera position is inside the bounds of the sphere, when the camera position drops below clouds.position.y / 2, the sky sphere renders incorrectly in front of the clouds. Also relevant but less concerning is that when I zoom out, the clouds mesh renders incorrectly in front of the sphere.

this does not happen with standard materials:

I will continue to investigate as usual, and would appreciate any insight.


update: I was able to fix this from the perspective of inside the sphere, by setting: skyMesh.alphaIndex = 1, which means the sky will always render in the background, which is what I want. But I’m still curious as to how I could fix this so it behaves more like StandardMaterial in this case. Thanks

This might help understanding better the limitation of transparent meshes: Transparent Rendering | Babylon.js Documentation

thank you. Apologies for all the questions. Sometimes the answers can be a little opaque. Forgive the pun :slight_smile: … I did reference that document, and I believe that’s where I found my fix. I guess I’m wondering why the standard material takes care of the depth buffer very elegantly, while with node material, this isn’t the case, and as always looking for an easy fix … In any case I will continue with my investigations. Thank you for your help in general and for this fantastic library.

no problem, let see if @Evgeni_Popov has a better answer cause my brain is all foggy from covid at the moment :slight_smile:

:open_mouth: uff, sorry to hear, take care. Get well soon.

1 Like

That’s because you plugged something into the a input of the FragmentOutput block: the system considers your material to be transparent, even if alpha=1.

You should plug a color3 into the FragmentOutput.rgb input instead and that should fix your problem.

1 Like

Ahhh ok, thank you!