Rendering depth to a texture in v4

[Kaelan]

I'm trying to implement a visual effect similar to old 2D games - when a player character walks behind an object, they're displayed translucent rather than being entirely occluded. Something like this:

I've never tried to do this before, but from looking at it, it seems like the way to go is: render scene object depth (z) values to a texture, have a filter attached to player sprites that reads the current pixel's depth value in the texture, and adjust the final alpha accordingly.

How would I go about doing this with PIXI - the first part in particular, rendering the scene depth to a texture?

From what I've been able to find, the appropriate way of doing this in WebGL seems to be using the WEBGL_depth_texture extension. I'm on PIXI v.4, and the only references to that which I can find are from the ContextSystem in v5. Is there a built-in way to enable the extension in v4? And if it's not available built-in, is it something I can modify code myself to enable? I'm building pixi.js directly into my project, so I can make changes to source if it's necessary - just not entirely sure what/where I need to change.

[ivan.popelyshev]

There's no built-in extension support in v4, neither it was in plugin, so you have to do your own webgl calls. Also, this extension isnt available on some devices.

However, the thing you want to achieve can be done with basic layering. When you render element, you can render it in multiple layers - just make a container with two sprites. one goes to ambient, one to your "depth texture". That takes care of webgl problems. But its not enough to do what you shown on screen! You need exactly now how you combine layers, house roof and character have to be in different layers!

Layer = container that is rendered in renderTexture separately from everything else.

Use pixi-layers if you want to omit all boring part of code.

For further discussion, please provide minimal technical demo , either in v5 either in v4, doesnt matter if it doesnt actually do your thing. I just cant write 2-hour lection on layers here. I can help with concrete case.

I saw how that depth was made for one of RMMV games, with volumetric fog!

Btw, is there any particular reason you stick to v4?

Welcome to the forums!

Edited March 22, 2020 by ivan.popelyshev