3D and 2D GUI together - ZIndex

Hello All,

I am using Babylon GUI (Advanced dynamic Texture) and Babylon 3D GUI as well. In the attached screenshot, mesh with G as label is 3D gui and rest in dynamic texture.

As you can see 3D GUI is coming on the top of texture. I want to know is there a way if i can put 3D GUI behind the texture ? My requirement is to make Advance Dynamic texture at the top.


Can you share a playground with us?

I don’t think a PG will be needed for that. It’s known that the 3D GUI renders on top of all layers including the FS ADT.

The fix comes in 5 simple steps:

  1. you need a second camera for the 2D GUI
  2. set a layerMask to the gui camera (i.e.

guicamera.layerMask = 0x10000000

then set your adt.layer to this same layerMask, ie.

advancedTexture.layer.layerMask = 0x10000000;


advancedTexture.layer.layerMask = guicamera.layerMask;

  1. attach both cameras at once

scene.activeCameras = [camera, guicamera];

  1. set the render camera on the 3D gui to the scene camera:


  1. If you need to act on these cameras, detaching them or anything, make sure you call first ‘scene.activeCameras = [camera, bgcamera]’ and then call again ‘manager.utilityLayer.setRenderCamera(camera)’

Hope I didn’t forget any part :grin:. Let me know if anything…

1 Like

Thanks Mawa !!

I will try this and update here…

Forgot to mention. Any camera for the gui will do since it renders on a fullscreen layer anyways. Usually, I simply clone the scene camera.

guicamera = camera.clone(“guicamera”)

Can we have a Playground for this ?

I guess so. It’s just not very sexy (my apologies :pray:). I was supposed to prepare a better version to be added to the deep-dive layer mask section of the doc but it looks like I didn’t do my homework :face_with_hand_over_mouth:

I hope it still has the content you are looking for (depite from looking uggly :grin: