Get current frame buffer texture for shader material

Questions
#1

Hi ! I’m trying to create a ShaderMaterial passing the current scene’s rendered result to the textureSampler.

shaderMaterial.setTexture("textureSampler", <pass current framebuffer texture >);

I’m not exactly sure where to get the texture from. I seem to recall its meant to be protected from access ?? sorry, memory is foggy. Does anyone have any clues ?

In case the texture is not meant for access, I’d like to ask how I can sample the pixel color of the current scene’s current camera result in my shaderMaterial as that is what the texture was meant for.

#2

You can create a custom render target texture and render the scene (meaning all the meshes) in it, then pass this RTT to your shader. The drawback is that you will effectively render the scene twice.

You can also use a “pass” post process and use Effect.setTextureFromPostProcess(...) to pass the texture to your shader.

Here’s an example of using a pass post process and setTextureFromPostProcess: https://playground.babylonjs.com/#18QHZC#1

2 Likes
#3

(foreword: I just finished a minor surgery and am pumped on drugs. Pls forgive me if I am not fully coherent)

What I’m trying to do: port a stylized water shader to bjs (ref: https://www.reddit.com/r/Unity3D/comments/f6bh50/making_stylized_water_with_shader_graph/)
Todo list:

  • depth to color control (completed: Babylon.js Playground)
  • Transparency control
  • UV distortion control
  • foam control

As you can see from the PG, I have a simple bathtub setup and the water color control to depth working. But the water mesh isn’t showing the texture of the objects behind it. To do so, I have to pass the current framebuffer to the shader and mix the result with the water color params. I have trouble passing the framebuffer texture to the shaderMaterial.

The post process route does not accommodate vertex shader which I have. If I uncomment lines 114 & 141, I get the depth map showing up on my water mesh indicating the framebuffer texture not going thru. If I rty to load it thru shaderMaterial.setTexture, console throws TypeError: this._textures[A].isReady is not a function

How can I check the ready state of the texture before passing into the shader?

1 Like
#4

Ive been there! Looks like something I could whip up for you pretty quick. Just now getting off for the night but Ill help tomorrow for sure. Get some rest after your surgery.

3 Likes
#5

rest doesn’t pay the bills… :sob:

1 Like
#6

Well I did not get a chance to look at this yet, but I got you for sure. Was too busy doing as you said above today.

#7

https://playground.babylonjs.com/#UNGKGD#4

Its not how he did it, but its kinda the same idea, just a single pass.

there are other ways to do it too

2 Likes
#8

https://playground.babylonjs.com/#P5HUDJ#11

This is actually going to be closer to what you requested.

I dont have time to look at it anymore, have lots of work to do.

4 Likes
#9

well, you did WAY WAY too much ! Many thanks ! :slight_smile:
I did mine slightly differently cos keeping the vertex shader is a must. I’ll integrate yours and post in Demos. Cheers!

1 Like