Order independent transparency in alpha.57 - how does it work?


I was so happy when I found out that OIT is merged into the alpha release. Now, I need some help to understand how to use it.

I tried:
for a material with mat.alpha=0.8, the result is opaque meshes.


Adding this makes all objects disappear:
scene.useOrderIndependentTransparency = true;

What else do I need?

1 Like

Welcome aboard!

Some documentation is coming regarding OIT. Adding @CraigFeldspar who may be interested in this thread as he is the creator of the functionality!

OIT is enabled simply by doing scene.useOrderIndependentTransparency = true.

For it to work, you should not set needDepthPrePass to true nor backFaceCulling to false:

Here’s one another PG using OIT:


Thanks so much for your speedy response.
Your examples do work in Chrome, but not in my Safari Browser.

@CraigFeldspar will have a look shortly but what version of safari and what platform are you running it on ?

Safari is currently full of webgl compliance test issue and I hope they ll address those soon.

It’s MacOS 11.5.1 and Safari 14.1.2.

Do you have any indication when this feature will be available in a stable Babylon version?

5.0 is planned to be release next april, but it all depends on when Safari will deploy a fix which we do not control.