Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

Cannot for the life of me figure out what's wrong (especially with how undocumented these two .js files are) but I've included the EffectComposer and BloomPass within my project and am trying to call it like so:

parameters = { bloomStrength: 1.3, bloomFactor: 1.0,}
            var renderPass = new THREE.RenderPass(scene, camera);
            var copyPass = new THREE.ShaderPass(THREE.CopyShader);
            copyPass.renderToScreen = true;
            composer = new THREE.EffectComposer ( renderer );
            composer.addPass(renderPass);
            composer.addPass(copyPass);
            var effectBloom = new THREE.BloomPass ( 3, 25, 5, 256);
            composer.addPass (effectBloom);
BloomPass.js throws an error by itself (not within my code) stating that "Uncaught TypeError: Cannot read property 'prototype' of undefined at BloomPass.js:76"The BloomPass 76 line is as follows:
THREE.BloomPass.prototype = Object.assign( Object.create( THREE.Pass.prototype ), {
I believe due to this the EffectComposer is also throwing an error for the 
composer.addPass(effectBloom); line: 
Uncaught TypeError: pass.setSize is not a function at THREE.EffectComposer.addPass
pass.setSize( size.width, size.height );
Any idea what I'm doing wrong? According to the few examples I'm setting everything up correctly...
Any help is greatly appreciated!
                Also to mention, if I comment out all these lines in my code and run it, BloomPass.js still throws that error, making me wonder if something is wrong with it?
– Turkeydipking
                Feb 20, 2017 at 10:23
                It would be much easier to help you if you set up a fiddle. You could fork This fiddle to create your own.
– 2pha
                Feb 20, 2017 at 14:00
You should put the CopyShader at the end of the composer not in the middle. This code works for me:
    renderer.autoClear = false;
    composer = new THREE.EffectComposer(renderer);
    var sunRenderModel = new THREE.RenderPass(scene, camera);
    var effectBloom = new THREE.BloomPass(1, 25, 5);
    var sceneRenderModel = new THREE.RenderPass(scene, camera);
    var effectCopy = new THREE.ShaderPass(THREE.CopyShader);
    effectCopy.renderToScreen = true;
    composer.addPass(sunRenderModel);
    composer.addPass(effectBloom);
    composer.addPass(effectCopy);
        
Thanks for contributing an answer to Stack Overflow!
Please be sure to answer the question. Provide details and share your research!
But avoid …
Asking for help, clarification, or responding to other answers.
Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.