Stencil without rendering

I’m experimenting with stencil. It’s basically working.
There is object0 in group 0 which writes to the stencil buffer and I have an object1 (group1) that is drawn everywhere outside the object0.

I now want to hide object0. I.e. it should still be used for the stencil buffer but not graphically rendered.

You can use material.disableColorWrite= true to disable writing to the color buffer.

Thanks. this works.
But is there maybe another solution without the material.
Seems a bit odd to me that I need to apply a material just to NOT draw it.

No, that’s expected.

Writing (or not) to the color buffer is only one aspect of a material and there are many others: writing/not writing to the depth buffer, writing/not writing to the stencil buffer, testing or not testing the depth buffer/stencil buffer, etc. Those are states that also affect how a mesh is drawn.

Thanks for explanation. Makes sense now.

But I ran into another problem.
See this pg:
https://playground.babylonjs.com/#JTS6PS

As long as the cylinder lines (41, 42, 47) are commented it works as expected:
There is a disc cut out of the box.

As soon as the cylinder is added, which exactly covers the disc at exact same height, the cylinder top is flickering or does not show a complete planar plane.
It seems as if it is interfering with the not-drawn disc.

Another interesting point is: If I reduce the discMesh.visibility to e.g. 0.01, this effect is (almost) gone.
Is there still something drawn even if disableColorWrite=true is set?

Disable colorwrite would prevent anything to draw as it instructs webgl to not draw in the color attachments.

The zbuffer is still updated. What you see is z-fighting between the ground and the disc because the disc is exactly on the same plane than the top of the ground. You can use a zOffset to offset the disc a little bit from the ground so that it is a little in front of it:

https://playground.babylonjs.com/#JTS6PS#1

You can also simply disable depth write for the disc (material.disableDepthWrite = true).

[EDIT] You can also use the new stencil property of the material, which makes it easier to work with stencil:

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

Note that lines 74-76 should not be needed but there is currently a bug which makes the stencil buffer not being cleared correctly without them.

disableDepthWrite = true stops the flickering.
(Strange for me was that the plane alone (also as exactly the same height as the disc) did not create flickering but the cylinder instead did.)

I would love to test your new stencil property but I’m developing under typescript and ‘stencil’ seems not be defined there for StandardMaterial (Error: Property “‘stencil’ does not exist on type ‘StandardMaterial’.”)

This property is new in 5.0, I think you are using 4.2?

OK, I see