Search code examples
three.jsrenderer

Resizing Window when using EffectComposer


I found this fiddle a mounth ago and I implemented it succesfully. It works like a charm except a specific scenario. If I resize the window, from very small to large, it becomes really obvious that the camera Projection Matrix doesn't get updated. This happens both on the jsFiffle example and in my implementation of it. Any possible fix? Thank you!

onWindowResize = function(){

    screenWidth  = window.innerWidth;
    screenHeight = window.innerHeight;

    camera1.aspect = screenWidth / screenHeight;
    camera2.aspect = camera1.aspect;
    camera3.aspect = camera1.aspect;

    camera1.updateProjectionMatrix();
    camera2.updateProjectionMatrix();
    camera3.updateProjectionMatrix();

    renderer.setSize( screenWidth, screenHeight);
}

Outline with effect composer demo: http://jsfiddle.net/Eskel/g593q/5/

enter image description here


Solution

  • The renderTarget (or targets) used by EffectComposer is not being resized when the window is resized.

    In your onWindowResize callback, be sure to call both of the following methods:

    renderer.setSize( width, height );
    composer.setSize( width, height );
    

    three.js r.71