# How to force rendering hidden objects?

**URL:** <https://forum.babylonjs.com/t/how-to-force-rendering-hidden-objects/17805>\
**Category:** Questions\
**Tags:** material\
**Created:** [January 24, 2021, 11:33am UTC](https://forum.babylonjs.com/t/how-to-force-rendering-hidden-objects/17805 "2021-01-24T11:33:55Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![MarkBevels](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/markbevels/32/13799_2.png) [@MarkBevels](https://forum.babylonjs.com/u/MarkBevels)\
**Post date:** [January 24, 2021, 11:33am UTC](https://forum.babylonjs.com/t/how-to-force-rendering-hidden-objects/17805/1 "2021-01-24T11:33:55Z")

</div>

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](https://playground.babylonjs.com/#K2P5XF)

 ![forced-rendering](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/3/35124f882b17512132dbabecc6abec7e0cd310c7.png)

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?

---

<div class="post-metadata">

**Author:** ![kvasss](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/kvasss/32/3774_2.png) [@kvasss](https://forum.babylonjs.com/u/kvasss)\
**Post date:** [January 24, 2021, 11:42am UTC](https://forum.babylonjs.com/t/how-to-force-rendering-hidden-objects/17805/2 "2021-01-24T11:42:49Z")

</div>

Hi. You can use second scene [Using Multiple Scenes | Babylon.js Documentation](https://doc.babylonjs.com/divingDeeper/scene/multiScenes#overlay-multiple-scenes) or use layer mask [Layer Masks and Multi-Cam Textures | Babylon.js Documentation](https://doc.babylonjs.com/divingDeeper/cameras/layerMasksAndMultiCam#different-meshes-for-multiple-cameras-using-layer-masks)

---

<div class="post-metadata">

**Author:** ![MarkBevels](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/markbevels/32/13799_2.png) [@MarkBevels](https://forum.babylonjs.com/u/MarkBevels)\
**Post date:** [January 24, 2021, 11:49am UTC](https://forum.babylonjs.com/t/how-to-force-rendering-hidden-objects/17805/3 "2021-01-24T11:49:34Z")

</div>

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. 🤔 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](https://doc.babylonjs.com/divingDeeper/materials/advanced/transparent_rendering#general-order) right now. It looks promising but then again… not sure how I could achieve blending.

---

<div class="post-metadata">

**Author:** ![avin](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/avin/32/14454_2.png) [@avin](https://forum.babylonjs.com/u/avin)\
**Post date:** [January 24, 2021, 12:01pm UTC](https://forum.babylonjs.com/t/how-to-force-rendering-hidden-objects/17805/4 "2021-01-24T12:01:38Z")

</div>

use renderingGroupId

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

---

<div class="post-metadata">

**Author:** ![MarkBevels](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/markbevels/32/13799_2.png) [@MarkBevels](https://forum.babylonjs.com/u/MarkBevels)\
**Post date:** [January 24, 2021, 12:01pm UTC](https://forum.babylonjs.com/t/how-to-force-rendering-hidden-objects/17805/5 "2021-01-24T12:01:43Z")

</div>

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.

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

```

 ![Screenshot 2021-01-24 at 11.57.50](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/f/f312beec02ee27b77fc711febd7c867ddcace456.png)  
[https://playground.babylonjs.com/#K2P5XF#2](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.

---

<div class="post-metadata">

**Author:** ![MarkBevels](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/markbevels/32/13799_2.png) [@MarkBevels](https://forum.babylonjs.com/u/MarkBevels)\
**Post date:** [January 24, 2021, 12:03pm UTC](https://forum.babylonjs.com/t/how-to-force-rendering-hidden-objects/17805/6 "2021-01-24T12:03:47Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [January 24, 2021, 12:19pm UTC](https://forum.babylonjs.com/t/how-to-force-rendering-hidden-objects/17805/7 "2021-01-24T12:19:47Z")

</div>

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](https://playground.babylonjs.com/#K2P5XF#4)

![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/f/f3835f2392f6f1ff7ec6093e7848a7e81c6c5cfc.png)

---

<div class="post-metadata">

**Author:** ![MarkBevels](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/markbevels/32/13799_2.png) [@MarkBevels](https://forum.babylonjs.com/u/MarkBevels)\
**Post date:** [January 24, 2021, 12:39pm UTC](https://forum.babylonjs.com/t/how-to-force-rendering-hidden-objects/17805/8 "2021-01-24T12:39:02Z")

</div>

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

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!