Jump to content

Scene compositing problems


Recommended Posts



i am compositing multiple scenes to a final render result. Currently i am not really sure if i am doing things correctly. Either i have hit multiple bugs or i am doing things wrong. So i am asking for feedback and or alternative ways to achieve my goal.


So here is what i have (a minimal testcase):




I tried to make a playground file but somehow i keep getting an error: http://www.babylonjs-playground.com/#24BIXP .


Some explanation on what i am trying to do:


I have a base scene with several objects. Then i have a special scene where i am rendering a few special objects. I want to apply a glow effect on these objects via postprocessing.


Finally i have a composite scene. I want to render both scenes as a RenderTargetTexture and then combine them: This should be my final render result.


Now i am having multiple problems:


1. Whenever i am using a scene ONLY as a renderTarget multiple BABYLON features won't work: Animations, Physics, Particlesystems (the red box in the example should have an animation).

2. How can i apply a post process for one scene only? I want to reuse the same camera (see code comments). Bug?


The more i am working with it the more i think that i am working against babylon.js :S How can i achieve my goal? Or am i doing everything alright and i simply hit some bugs? :S

Link to comment
Share on other sites



That's a lot of questions :)


1. Just in case I would like to get some playgrounds example to understand each step :)

2. You cannot share a camera between scene



But from my point of view:

- I would probably suggest to keep just one scene

- You can have several cameras and use them with various custom render target (see example here:https://github.com/BabylonJS/Samples/blob/master/Scenes/Customs/customRenderTarget.js )

- renderTarget can use beforeRender and afterRender to define meshes visibility (in order to hide some of them according to the current renderTarget)



Not sure I'm clear :D

Link to comment
Share on other sites

Sorry for the late reply and thanks for your answer.


What you describe makes sense to me and i would really like to have only one scene. I consider my initial approach a big, ugly workaround. That's why i reached out to the forums ;)


However i still can't figure out how to achieve my goal in code:




I now have my scene and a plane to display my rendertarget.


However switching the activeCamera in renderTarget.onBeforeRender doesn't seem to work :S


Also how would i position the plane so it would always fill out the screen (like a glass pane right in front of the camera).

Link to comment
Share on other sites

I am very very close to the desired result now :)






1. the postprocess effect on the rendertargettexture camera won't get applied :( I could of course merge the shader with my result postprocess but i think that would be very ugly :(

2. you can't use isVisible with rendertargettextures (i worked around using material.alpha which is ok for me)

Link to comment
Share on other sites

I want to render the target texture and then apply a post process effect on the result.

Afterwards i want to mix the resulting (post processed) image with the rest of the scene.


In my example:


I want to render the red box separately with the applied to it. Then i want to render the normal scene WITHOUT the blur. The resulting image should contain a blurred red box and 

the non blurred scene. Does that make sense?


1. During scene rendering postprocesses on rendertargetcameras will be ignored (won't get applied) => https://github.com/BabylonJS/Babylon.js/blob/master/Babylon/babylon.scene.ts#L1258 (its hardcoded to false :|)

2. see above. i hope it is clear? :S

Link to comment
Share on other sites

ah lol...didn't even answer to 2:




I replaced the alpha workaround with "isVisible". As you can see the red box is now NEVER visible. It should however be visible for the renderTarget. The red box should never be rendererd as part of the main scene. That's not possible using isVisible it seems. However material.alpha works. That is perfectly fine for me

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...