Mesh and material transparency

Questions
1

Trying to make two meshes transparent only where they overlap each other, any suggestion how to achieve this ?

transparency_issues
transparency_issues816×385 58.7 KB

These are material settings:

var material = new BABYLON.PBRMaterial(meshdata.name + “_” + inx, scene);

             material.albedoColor = materialcolor;
            material.backFaceCulling = false;
            material.twoSidedLighting = true;
            material.metallic = 1;
            material.alphaMode = BABYLON.Engine.ALPHA_MAXIMIZED;
            material.transparencyMode = 2;
2

Hello and welcome!

can you simply separate them? maybe using CSG so you keep the intersection mesh and make it transparent?

3

You can use the stencil buffer for this:

https://playground.babylonjs.com/#NP87V7#1

In this PG, the dude writes 1 in the stencil buffer where it is drawn.

The plane is drawn normally everywhere where the stencil is not equal to 1.

A copy of the plane with a transparent material is drawn everywhere where the stencil is equal to 1.

Note that the sphere is completely hidden by the plane because it writes 0 to the stencil buffer, not 1.

[EDIT] Small correction in the PG, the stencil mask must be reset to 0xFF before clearing the stencil buffer, else the clearing is not done. [/EDIT]

4

Even better :slight_smile:

5

Thanks for the help! I got it :slight_smile:

1 Like