# Render current frame multiple times to separate images **URL:** \ **Category:** Questions\ **Created:** [November 9, 2024, 11:59pm UTC](https://forum.babylonjs.com/t/render-current-frame-multiple-times-to-separate-images/54663 "2024-11-09T23:59:26Z")\ **Posts on this page:** 10\ **Page:** 1
**Author:** ![Charge](https://avatars.discourse-cdn.com/v4/letter/c/f475e1/32.png) [@Charge](https://forum.babylonjs.com/u/Charge)\ **Post date:** [November 9, 2024, 11:59pm UTC](https://forum.babylonjs.com/t/render-current-frame-multiple-times-to-separate-images/54663/1 "2024-11-09T23:59:26Z")
Hi, I would like to render each frame of a Babylon scene multiple times with different outputs to multiple images. For example, for each frame I would like to render: Colour image Depth Each item unlit in a distinct colour Each skeleton I’d like to render each of these images separately at a specified resolution to an image file that I could download. Additionally, I would like to be in control of the time step so the animations and physics update as though 1/60th of a second has passed between the 4 screenshots being taken regardless of how long it actually takes. I realise this is not possible out of the box, but was hoping someone could point me towards some documentation or Babylon code files that could help? Thanks ---
**Author:** ![Heaust-ops](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/heaust-ops/32/45470_2.png) [@Heaust-ops](https://forum.babylonjs.com/u/Heaust-ops)\ **Post date:** [November 11, 2024, 4:59am UTC](https://forum.babylonjs.com/t/render-current-frame-multiple-times-to-separate-images/54663/2 "2024-11-11T04:59:50Z")
you can use [Render Target Texture](https://doc.babylonjs.com/features/featuresDeepDive/postProcesses/renderTargetTextureMultiPass) to do most of it : ) for example here, I wanna render only the sphere and just red in color to a texture > **[Babylon.js Playground](https://playground.babylonjs.com/#M0LB1L)** > > Babylon.js playground is a live editor for Babylon.js WebGL and WebGPU 3D scenes ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/7/c/7cc04602958e1ff36b6dcb6786f21a473a9204a1.png) and also get the depth of the scene ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/b/0/b0d7dfc259b7a5e7530885a40f08df8f9452aaff.png) so you can, on each render, before your RTT renders, change the scene state to however you want and after the rtt render restore it : ) and you can do this at a resolution you specify! you can even have a separate camera for each different RTT by changing the `rtt.activeCamera` you can get the depth in your chosen rtt like (say if you want it from a different res or cam) > **[Babylon.js Playground](https://playground.babylonjs.com/#1PHYB0%23189)** > > Babylon.js playground is a live editor for Babylon.js WebGL and WebGPU 3D scenes (source: [Using a custom depth texture source with post processes, rather than the DepthRenderer](https://forum.babylonjs.com/t/using-a-custom-depth-texture-source-with-post-processes-rather-than-the-depthrenderer/34007)) _(you can also use a `new DepthRenderer()` and the texture inside it like an rtt)_ as for timing it for animations, if you change the state before and after that’d work, but idrk about timing the render exactly tbh ---
**Author:** ![Charge](https://avatars.discourse-cdn.com/v4/letter/c/f475e1/32.png) [@Charge](https://forum.babylonjs.com/u/Charge)\ **Post date:** [November 11, 2024, 2:23pm UTC](https://forum.babylonjs.com/t/render-current-frame-multiple-times-to-separate-images/54663/3 "2024-11-11T14:23:43Z")
Hi @Heaust-ops - thanks for the information, its really helpful. The first link to the playground doesn’t seem to be to what you describe. Do you have the correct link? Thanks ---
**Author:** ![Pryme8](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/pryme8/32/7212_2.png) [@Pryme8](https://forum.babylonjs.com/u/Pryme8)\ **Post date:** [November 11, 2024, 3:29pm UTC](https://forum.babylonjs.com/t/render-current-frame-multiple-times-to-separate-images/54663/4 "2024-11-11T15:29:06Z")
> **[Babylon.js Playground](https://playground.babylonjs.com/#BK3O29%231)** > > Babylon.js playground is a live editor for Babylon.js WebGL and WebGPU 3D scenes Here you go, I did this a while back and just saw your post. ---
**Author:** ![Heaust-ops](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/heaust-ops/32/45470_2.png) [@Heaust-ops](https://forum.babylonjs.com/u/Heaust-ops)\ **Post date:** [November 11, 2024, 4:07pm UTC](https://forum.babylonjs.com/t/render-current-frame-multiple-times-to-separate-images/54663/5 "2024-11-11T16:07:07Z")
> The first link to the playground doesn’t seem to be to what you describe. Do you have the correct link? Oh yeah! my bad, just edited [the first link](https://playground.babylonjs.com/#M0LB1L) : ) you’ll have to click in this order to get to the texture ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/d/0/d060b297a280535a1343895b3ba84fad548d1b69.png) ---
**Author:** ![Charge](https://avatars.discourse-cdn.com/v4/letter/c/f475e1/32.png) [@Charge](https://forum.babylonjs.com/u/Charge)\ **Post date:** [November 11, 2024, 4:40pm UTC](https://forum.babylonjs.com/t/render-current-frame-multiple-times-to-separate-images/54663/6 "2024-11-11T16:40:27Z")
thank you, that is also a huge help 👍 ---
**Author:** ![Charge](https://avatars.discourse-cdn.com/v4/letter/c/f475e1/32.png) [@Charge](https://forum.babylonjs.com/u/Charge)\ **Post date:** [November 11, 2024, 4:40pm UTC](https://forum.babylonjs.com/t/render-current-frame-multiple-times-to-separate-images/54663/7 "2024-11-11T16:40:43Z")
thanks again @Heaust-ops 👍 ---
**Author:** ![Charge](https://avatars.discourse-cdn.com/v4/letter/c/f475e1/32.png) [@Charge](https://forum.babylonjs.com/u/Charge)\ **Post date:** [November 26, 2024, 9:47am UTC](https://forum.babylonjs.com/t/render-current-frame-multiple-times-to-separate-images/54663/8 "2024-11-26T09:47:00Z")
@Pryme8 - I’ve been looking to implement this today and I’ve come across something in your code that I don’t understand. The captureRTTasBlob arrow function takes a renderTargetTexture for the renderTarget parameter. This value is then passed into the BABYLON.Tools.CreateScreenshotUsingRenderTarget method as the 3rd parameter. However, the 3rd parameter for this method seems to be size: IScreenshotSize | number, so I guess I’m missing something and was hoping you could help? Thanks again. ---
**Author:** ![Pryme8](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/pryme8/32/7212_2.png) [@Pryme8](https://forum.babylonjs.com/u/Pryme8)\ **Post date:** [November 26, 2024, 3:56pm UTC](https://forum.babylonjs.com/t/render-current-frame-multiple-times-to-separate-images/54663/9 "2024-11-26T15:56:58Z")
Its just getting the width and the height from the rtt, looking over it it does not look like its actually using the rtts that I made and rather are just modifying a single one with the texture setup phase. There are other ways to grab the rtts directly but for this you can just do the capture and texture setup. > **[Babylon.js Playground](https://playground.babylonjs.com/#BK3O29%232)** > > Babylon.js playground is a live editor for Babylon.js WebGL and WebGPU 3D scenes Here is a cleaned up one showing how to dont need the rtts. They where just a relic of a different process I was doing. ---
**Author:** ![Charge](https://avatars.discourse-cdn.com/v4/letter/c/f475e1/32.png) [@Charge](https://forum.babylonjs.com/u/Charge)\ **Post date:** [November 26, 2024, 8:32pm UTC](https://forum.babylonjs.com/t/render-current-frame-multiple-times-to-separate-images/54663/10 "2024-11-26T20:32:37Z")
@Pryme8 - thanks 👍