Issue Rendering ShaderMaterial Snapshot Using RenderTargetTexture in Babylon.js

Questions
1

Hi,

I create awesome clouds for my game on a plane using ShaderMaterial.

However, it’s resource-intensive, so I would like to take a snapshot of the Babylon plane with ShaderMaterial using RenderTargetTexture and apply it to a new Babylon plane with a StandardMaterial using a DiffuseTexture.

But it does not render as I expected, and I’m struggling to find the issue. Any help would be appreciated. You can look at this playground: Babylon.js Playground

2

You might want to render your clouds to a procedural texture (Babylon.js docs) and then assign that texture to the StandardMaterial. This would simplify the setup a great deal.

3

Thanks, here is the test I made: Babylon.js Playground using CustomProceduralTexture, now I have to figure out why its greenish :slight_smile:

Figure it out, I missed a property: https://playground.babylonjs.com/#BLOZ5Y#1

4

Note that the texture is still rendered each frame (else, you would not see the animation). So, it’s not really different from your first PG, except that you are using a procedural texture instead of a shader material.

If you don’t want the texture to be generated each frame, you can set refreshRate to 0 to never refresh it (but you won’t get any animation), or a value greater than 1 to update it every 2 frames (refreshRate = 2), 3 frames (refreshRate = 2), etc:

Refresh every 5 frames: