Need help with PostProcessing and MeshDepthMaterial (weird banding with result)

I am using postprocessing DepthPass which does a RenderPass of the screen replacing all the materials with MeshDepthMaterial. You can see in the image it creates these bands that cant be right. the Camera view is a mostly topdown view so the view is mostly just the ground plane at a slight angle. I do the same technique with the MeshNormalMaterial and that works great. Assuming i have something setup wrong but can’t figure out what to try next.

The DepthPass is using RGBADepthPacking so i am ok with the colors.

Could you create a demo / jsfiddle showcasing the issue and the code (at least the part related to postprocessing) :thinking: ? May be easier to tell the issue.

Here is a codesandox →

So it appears that the Banding is normal and just how the depth is packed creates this effect when rending the color, maybe…

i am trying to convert it to grayscale to see something like: three.js docs

I think i have run into several issues along the way around my camera’s near and far plane. The current setting in the sandbox show my current state.

The USE_BUILTIN option tries to use the depth from the DepthTexture that postprocessing creates automatically. I can’t seem to read this value or get it to work.

USE_DEPTH_PASS uses the DepthPass with RGBADepthPacking and displays the packed color value.

USE_UNPACKED uses the DepthPass color value and converts it to depth with the unpackRGBAtoDepth function.

^^^^ I did something to get this to work, BUT the depth seems to be 1 or 0 not a relative scale from the near to far plane.