Depth rendering issue when using logarithmic depth buffer

[nidin]

Setting WebGLRenderer parameter logarithmicDepthBuffer : true causes depth rendering issues. Please see the screenshots.

logarithmicDepthBuffer : true	logarithmicDepthBuffer : false

[swingingtom]

hi @nidin, thanks for the report and sorry for the delay.

I was wondering if you could assist me on that issue? I never used logarithmicDepthBuffer and therefore I don't know how this work internally. Do you have some knowledge about that ?

What I can tell is, currently in v6.4.4 and above, ThreeMeshUI.Block automatically sets a renderOrder on its frame (background mesh) from its "ui depth" (number of ui parents a block have):

• ThreeMeshUI.Block ( container ) => .renderOrder = 0;
  • ThreeMeshUI.Block ( header ) => .renderOrder = 1;
    • ThreeMeshUI.Block ( title container ) => .renderOrder = 2;
  • ThreeMeshUI.Block ( footer ) => .renderOrder = 1;

Whereas ThreeMeshUI.Text automatically sets a .renderOrder = Infinity;.

I could provide you some snippet to tweak the renderOrder property by is your issue the red background or the "9" ?

[nidin]

Hi Tom, Thanks for your reply. No worries about the delay. The issue is rendering order of the red block. I just created it to demonstrate the problem. All objects of ThreeMeshUI.Block is rendering behind the normal objects. I will try the renderOrder property and let you know the result. I don't know how logarithmicDepthBuffer works internally but I will investigate it.

[tinotibaldo]

@nidin I managed to fix this by including the

common logdepthbuf_pars_vertex logdepthbuf_vertex logdepthbuf_pars_fragment logdepthbuf_fragment

chunks on the Text shaders,

following these comments here https://github.com/mrdoob/three.js/issues/18800 and https://discourse.threejs.org/t/using-webglrenderer-with-logarithmicdepthbufferset-option-set-to-true-together-with-shadermaterial/5051

@swingingtom Do you think I should create a PR with these additional ones?

Cheerios

[swingingtom]

@tinotibaldo yes absolutely. Thanks!