I’m learning post processing in threejs. But don’t understand officil’s demo from:
https://threejs.org/examples/webgl_postprocessing_unreal_bloom_selective.html
I can’t understand the render’ logic in case of ‘Scene with Glow’:
firstly, it set bloomComposer.renderToScreen = false;
then, call renderBloom, to render the selected meshs, but what the meaning of renderToScreen = false? ( I tried to switch renderToScreen=true, had differenct effect, but don’t know the reason, neither)
finally, call the finalComposer, I don’t understand this effect too. Why use shader here?
It’s something like photoshop’s making layer?
function render() {
switch ( params.scene ) {
case 'Scene only':
renderer.render( scene, camera );
break;
case 'Glow only':
renderBloom( false );
break;
/**********************************
***********************************
My question is here
***********************************
**********************************/
case 'Scene with Glow':
default:
// render scene with bloom
renderBloom( true );
// render the entire scene, then render bloom scene on top
finalComposer.render();
break;
}
}
function renderBloom( mask ) {
if ( mask === true ) {
scene.traverse( darkenNonBloomed );
bloomComposer.render();
scene.traverse( restoreMaterial );
} else {
camera.layers.set( BLOOM_SCENE );
bloomComposer.render();
camera.layers.set( ENTIRE_SCENE );
}
}
function darkenNonBloomed( obj ) {
if ( obj.isMesh && bloomLayer.test( obj.layers ) === false ) {
materials[ obj.uuid ] = obj.material;
obj.material = darkMaterial;
}
}
function restoreMaterial( obj ) {
if ( materials[ obj.uuid ] ) {
obj.material = materials[ obj.uuid ];
delete materials[ obj.uuid ];
}
}