Only show opaque objects behind transparent objects


Can threejs realize scene as this link described?

I have found let transparent objects with depthTest & depthWrite enabled may help for only draw the top most transparent object, but a black quad may display, due to underlying objects be discard.

Is it possible to render transparent objects with z-buffer enabled to a “transparent layer” first, then draw the result “transparent layer” with opaque object to got the expecting effect?

I think it should be possible to implement the approach mentioned by the user Syntac_ using WebGLRenderTarget’s.

but a black quad may still display, due to underlying objects be discard (if texture is a circle with transparency around & geometry is PlaneGeometry)?

TBH, I’m not sure what you mean. Any chances to provide a live demo that demonstrates your problem?