在渲染ShaderPass之前更改场景

Question

我有一个场景，我有一个着色器，在场景顶部应用绿色方块。我有一个白色的球体但我希望当球体落在绿色方块之外时它是不可见的。我可以在渲染过程之前移除球体并在绿色着色器通过之前重新添加吗？如果没有，我怎样才能实现我的目标？

这是我的渲染过程：

renderPass = new THREE.RenderPass(scene, camera);
copyPass = new THREE.ShaderPass(THREE.CopyShader);

colorifyPass = new THREE.ShaderPass(THREE.ColorifyShader);
colorifyPass.uniforms[ "color" ].value = new THREE.Color(0x00ff00);
composer = new THREE.EffectComposer(renderer);
composer.addPass(renderPass);
composer.addPass(colorifyPass);
composer.addPass(copyPass);
copyPass.renderToScreen = true;

以下是我现在所拥有的截图：

Answer 1

感谢WestLangley的例子，我最终实现了我想要的方式：

function initShaders() {
    renderPass = new THREE.RenderPass(scene, camera);
    copyPass = new THREE.ShaderPass(THREE.CopyShader);

    composer = new THREE.EffectComposer(renderer);
    composer.addPass(renderPass);
    composer.addPass(copyPass);
    copyPass.renderToScreen = true;

    colorifyPass = new THREE.ShaderPass(THREE.ColorifyShader);
    colorifyPass.uniforms[ "color" ].value = new THREE.Color(0x00ff00);
    composerIR = new THREE.EffectComposer(renderer);
    composerIR.addPass(renderPass);
    composerIR.addPass(colorifyPass);
    composerIR.addPass(copyPass);
    copyPass.renderToScreen = true;
}

并将此代码添加到render（）函数：

    renderer.setViewport(0, 0, width, height);
    camera.fov = 45;
    camera.aspect = window.innerWidth / window.innerHeight;
    camera.updateProjectionMatrix();
    hotSpotsRoot.visible = false;

    renderer.clear();
    composer.render(delta);

    if (irMode) {
        var irWidth = 450;
        renderer.setViewport(width / 2 - irWidth / 2 + 10, 200, irWidth, irWidth);
        camera.fov = 25;
        camera.aspect = 1;
        camera.updateProjectionMatrix();
        hotSpotsRoot.visible = true;

        composerIR.render(delta);
    }