Screenshots and framebuffer problems

Questions
,
21

Ok, I think using the lastest Babylon screenshot tools, combined with the engine.endFrame() has this working.

The code is now basically like this:

 const engine: any = scene.getEngine() as Engine;
      const camera = scene.activeCamera as Camera;
      const obs = scene.onBeforeRenderObservable.add(async () => {
        scene.onBeforeRenderObservable.remove(obs);
        const screenshot = await ScreenshotTools.CreateScreenshotUsingRenderTargetAsync(
          engine,
          camera,
          screenshotSize,
          mimeType,
          4,
          true,
        );
        resolve(screenshot);
      });
      scene.render();
      engine.endFrame();

Using this, the render loop can be paused and the frame buffer always appears flushed. You were right, and this seems only slightly slower. I have no idea what I did wrong before.

I’ll confirm this is fixed once we run through some more builds :slight_smile:

2 Likes
22

Confirmed fixed :white_check_mark:

23

One last question here. Someone asked me to explain why the frame buffer issue doesn’t happen with a render target texture and in explaining it I realized I don’t fully understand it. I’m assuming that the writing of the frame buffer to the WebGL canvas happens in a sequence and the canvas is cleared as the next render happens, whereas the render target texture is just written to once as each render is totally complete? Is there a better way to explain this?

24

Yes, I think it has something to do with the fact that the swap chain texture (the final “framebuffer” in which we render) is handled by the browser and we don’t really know when/if all commands are really executed when we read back the texture whereas using our own texture we may expect it to be up to date at the end of the frame… But this is only speculations and I’m not really sure of that…

1 Like