How to force rendering hidden objects?

Questions
1

How can I force green plane to always render, even if behind other objects. Given setup shown as below (left image) I would want to always render green plane blending its color with what is in front of it (right image), but I can settle for for non-opaque/non-blended rendering if it is easier to do.

https://playground.babylonjs.com/#K2P5XF

forced-rendering
forced-rendering1803Ă—672 56.7 KB

I am totally out of my depth depth here. I suspect I should write custom shader or somehow change rendering order but not sure what I should even research for. Could anyone at least point me to the right direction please?

2

Hi. You can use second scene Using Multiple Scenes | Babylon.js Documentation or use layer mask Layer Masks and Multi-Cam Textures | Babylon.js Documentation

3

Thanks @kvasss but can’t really use second scene since green plane should be rendered in the same world space as everything else. Example is simplified but plane transform in my app is calculated based on transforms of other meshes. I don’t really want to use second scene for that.

To be honest, I am not sure how layer mask would solve the problem either. :thinking: Same as above, I want all meshes to render and only force one of the materials (for green plane) to render last.

I am looking at rendering order right now. It looks promising but then again… not sure how I could achieve blending.

4

use renderingGroupId

Check this out (line 28)
https://playground.babylonjs.com/#K2P5XF#3

2 Likes
5

I think I’ve got it.

Going through docs I can see that I can force higher index on rendering group and then setting material alpha and alphamode I am almost there.

    plane.material = visibleMat        
    plane.material.alpha = 0.8
    plane.material.alphaMode = 2
    plane.renderingGroupId = 1.  // <-----------

Screenshot 2021-01-24 at 11.57.50
Screenshot 2021-01-24 at 11.57.501796Ă—942 34 KB

https://playground.babylonjs.com/#K2P5XF#2

Not 100% what I wanted but it will do for now.
I am still open to suggestions if there are any.

1 Like
6

Yes… thanks @avin. Hahaha! Literally did that 60s ago. :smiley: Much appreciated!
I absolutely love this forum and community!

1 Like
7

What you can do is drawing the plane a second time but using a reversed depth test: instead of using “less than equal” (which is the default one), use “greater” to draw the plane where it should normally not be drawn:

https://playground.babylonjs.com/#K2P5XF#4

image

3 Likes
8

Ladies and gentlemen… here it comes again! (drumroll) BIG BRAIN @Evgeni_Popov. :heart_eyes:

Not only it does 100% what I was after but actually gives me full control over both opacity and colour as well!!!
Changing solution to yours (obviously)! And as always… THANK YOU very much! Dunno where @Deltakosh found you but I think you have answered every question I asked since I joined last week. KUDOS!

3 Likes