RenderTargetTexture - problems rendering a scene to a texture

I am trying to create a spritesheet in my system. I had this working previously in Three.js and now I am trying to get it going again in babylon and I am having many difficulties.

So user uploads a bunch of images, they get created as materials and put on a set of planes. (working)
A RenderTargetTexture is created and those planes are added to it and render is called.
A new material is created using that texture.
A new plane is created showing that texture on screen. This comes out a mess. Not sure where to start asking about this.

I want to create a new scene and have the rendertargettexture render that scene, but it looks like I have to render the planes to screen (the main visible scene) or it won’t work. I really want offscreen rendering like I used to have - does babylon support this?

I’m really very lost at this point after days of working on this. Does anyone have a simple example of rendering a texture to a multiple planes, onto a rendertexture and then rendering that plane to screen?

You can do something like that:

https://playground.babylonjs.com/#M7KDM6

The objects you put in the RTT.renderList array are rendered in the RTT whatever their layerMask / the camera layerMask is.

So, you can set a layer mask on the camera so that these objects are only rendered into the RTT and not to the screen. For the object(s) you want to be rendered to the screen (like the plane in the PG), you must set a layer mask compatible with the camera layer mask.

1 Like

Thanks, thats helpful. I ended up solving the problem by waiting for the render loop to complete and then making the other planes invisible, but it seemed like a really hacky workaround. But so does your method - now I have to set all visible objects to some strange layerMask value. (I deal with a lot of objects all over my app, so this is actually a big change to a lot of code to support one small part).

I tried setting the layerMask on just the RTT objects, but no that doesn’t work either.

I don’t understand why this wouldn’t be simple - create a different scene and add all the objects you want to render to the RTT. Why does it have to be the main scene?

You can use two scenes:

https://playground.babylonjs.com/#AQRQSE

But the objects must be created in the scene you want to be rendered in the RTT. If you create the objects in the main scene, they will also be rendered in the main scene. In a given scene, if you want some objects to be rendered in the RTT and not in the default output, I think there’s no other way than using the layerMask property.

2 Likes

Yes thanks - I actually think this is how three.js did it, now I understand things better.

Thanks for the help.