My current rendering setup encounters a resizing issue when adjusting the browser window size.
In my setup, I am rendering two scenes - one for objects with postprocessing effects applied. The postprocessing effects are achieved using THREE.EffectComposer and shaders from the example directory.
To combine the two scene renders, I use another shader example that performs additive blending.
You can view a simplified version of this setup here: http://jsbin.com/hibum/18/edit?js,output. (In the HTML section, I have included necessary JavaScript sources from the three.js repository)
If you resize the output panel, then reload the page and expand it again, you will notice the following:
The main scene (depicted by a blue sphere) updates its rendering size correctly, but the effects scene (shown as an orange sphere) maintains the same resolution, getting upscaled instead.
I am trying to determine which render target, renderer, or shader uniform needs updating during a browser resize event to ensure the image is rendered accurately after resizing.
For the main composer, calling setSize()
resolves the issue. However, performing the same action on the effects composer results in the effects scene not being rendered.
Any assistance on this matter would be greatly appreciated. Thank you.