Proper way to capture a PBR material render in a texture

Hi @sebavan!
I am trying to capture a PBR material (Substance) in a gl texture that I can use in a custom emscripten library. I have all of the plumbing to make this work and I have had some success but I am questioning if I am (a) going about this the best way and (b) what might I be doing incorrectly with the current setup. I have tested the technique in this playground. That appears to work as I expected.

When I use a similar technique, basically just using babylon to render the Substance material (gltf) and attempt to capture the underlyingResource of the RenderTargetTexture to feed to the emscripten bindings I am using. It doesn’t appear to capture the texture in a way that I expected. If I set the clearColor of the RenderTargetTexture I do see that color in the result using the emscripten library. When looking at a capture of the commands with spectorjs, things mostly look right. I have attached the spectorjs capture capture (967.9 KB)

Let me know if there is a better approach to this.
Thanks in advance!

I would usually go more with a setup like this:

basically setting your ortho cam outside the scene active cam, but associated with the rtt and placing the rtt in the required rendered target :slight_smile:

Thanks @sebavan. That looks good. I will make those changes and see where that leads next.

1 Like

I gave that a try but I think that I am stumbling on something more fundamental. What I want, is to have the output of the scene go to the RenderTargetTexture but what I am seeing is that it is binding null as the framebuffer and so all output is going to the canvas. I have stepped through the code and also in looking at the spectorjs capture what I am seeing is:
(1) set viewport, bind framebuffer for render target texture, clear
(2) unbind the render target texture’s framebuffer, i.e. bind null
Then render the mesh. If I have scene.customRenderTargets set, I was expecting that a call to scene.render() would output to the associated RenderTargetTexture framebuffer.

What am I missing here?

I did find at least one thing that I was missing. In loading the gltf file, I was using the root mesh from the result of SceneLoader.ImportMeshAsync(...).meshes[0] but that mesh has no sub meshes which (as you know) doesn’t create any rendering groups for the RenderTargetTexture and hence nothing gets put into the associated framebuffer. By using the second mesh in that list, which does have sub meshes, I get a framebuffer with the rendered result in it (using spectorjs to confirm that). I am still running into some rendering issues, but, this is a good step forward.


Figured out the issue. Needed to wipeCaches(true) and additionally add some context cleanup in the emscripten library.

1 Like

Perfect, yup this is the main issue with cross context usage