Mesh outline depth calculation failure

Hello! I’m having a depth calculation issue when using the mesh outline feature. I notice the edge of outlines on meshes often shows through walls when the occluded mesh with an outline enabled is viewed at a steep angle.

I’ve reproduced the bug I’m describing here: https://playground.babylonjs.com/#3UWLQ6#2
This even occurs when the mesh in front of it does NOT have any outline. See: https://playground.babylonjs.com/#3UWLQ6#5
And also occurs with multiple meshes occluding the outlined mesh: https://playground.babylonjs.com/#3UWLQ6#6

I’m trying to create a game that uses this outline functionality on EVERY mesh within my scene and this issue becomes prevalent in many areas as a result of having outline enabled on literally everything. To me, this is indicative of a depth calculation issue when the camera becomes near perpendicular to the surface normal on the mesh with an outline enabled. This should hopefully be a relatively simple bug fix (at least I’m hoping!)

This should also be all the necessary information to describe and demonstrate the bug. I could not find any other similar discussion of this bug within the forums, but if this is a known bug already, my apologies. If any further information is needed, let me know!

Welcome aboard!

The problem is that we use zOffset for outline rendering, which means artifacts may appear depending on the scene and the camera position…

You can try to fix them by changing the values of scene.getOutlineRenderer().zOffset and/or scene.getOutlineRenderer().zOffsetUnits.

In your Playground, if I set scene.getOutlineRenderer().zOffset = 0.2;, I no longer get any artifacts.

You can also try the new selection outline renderer, which does not depend on zOffset/zOffsetUnits:

2 Likes

Interesting, thank you!!!

I now wonder, since you say the “outline renderer” is newer, does it also happen to run more efficiently on large numbers of meshes? I have about 200 meshes in my scene, 30k vertices total.

If so, I’ll certainly switch to using that instead (assuming hard outlines are also achievable with this method), and thank you again for finding a solution to my problem so quickly!

Good question!

We didn’t perform any comparison between both renderers.

That would really be interesting if you were able to do it on your side, as you already have a real scene with a lot of meshes!

I suspect that for so many meshes, the selection outline renderer will be faster, because the outline renderer renders the mesh two additional times to generate the outline, whereas the selection outline renderer needs a few additional render passes, but doesn’t re-render each mesh several times.

I will try to do some testing and create a new post detailing my findings whenever I get around to it! I still have other more important tasks on my priority list for now, but when I get to it, this will be the first thing I do!

Until then, your solution of simply adjusting the .zOffset value (within the current mesh outline solution I’m using), seems to have solved my post’s original depth clipping problem! Thanks again :blush:

1 Like