Problem with renderingGroupId and 3D menus

Greetings Babylonians. I’ve got an app that creates a 3D menu. The same app also creates another object, with renderingGroupId set to 2. But changing the renderingGroupId on the object also changes the render order of the 3D menu, even though the object has nothing to do with the menu. Here’s an example of the problem:

https://playground.babylonjs.com/#MJCEBH#5

Any suggestions re. how to overcome this? Could it be a bug?

As always, thanks for all your help!

Hello and welcome!!

So the GUIManager is relying on an utility layer to render. Which means it will always render after the scene but it will reuse the scene depth buffer to integrate.
More info: Use UtilityLayerRenderer - Babylon.js Documentation

In your case the depth buffer is cleared between the two rendering groups but this is something you can control:

var setup =scene.getAutoClearDepthStencilSetup(2);
setup.depth = false;

https://playground.babylonjs.com/#MJCEBH#5

But in this case you are back like there was no renderinggroup.

I would then suggest to maybe render the sphere using a second scene (or your own utility layer)

1 Like

Thank you, @Deltakosh! That was just the advice I needed. In case it helps anyone else, here are some working examples of the solution: https://playground.babylonjs.com/#MJCEBH#9

1 Like