Is there a way to set clearPass on BokehPass?

Basically I am trying to add BokehPass with Clearpass to get a transparent background.

I have

renderer = new THREE.WebGLRenderer({ alpha: true });
scene.background = null;


composer = new EffectComposer( renderer );

	clearPass = new ClearPass( params.clearColor, 0 );
	composer.addPass( clearPass );
renderPass = new RenderPass( scene, cameraP );
    renderPass.clear = false;
	composer.addPass( renderPass );
var bokehPass = new BokehPass( scene, cameraP, {
					focus: 1170.0,
						aperture:	0.2,
						maxblur:	3.0,

						width: width,
						height: height
					} );

	composer.addPass( bokehPass );


function animate() {

				requestAnimationFrame( animate );


				cameraP.updateMatrixWorld( true );

				clearPass.enabled = params.clearPass;
				clearPass.clearColor = 0x00ff00;
				clearPass.clearAlpha = 0;




I even tried setting the

renderer.setClearAlpha( 1.0 ); // SET to 0

in BokehPass.js

I really have no clue how and in which order does the passes are rendered.

Please help.

to get a transparent background.

BokehShader set the alpha value of each fragment to 1.

You can try to remove this line and see how it works.

1 Like

Ya… it works! but the CCS background color is casted over the object

I guess this is the reason why gl_FragColor.a is set to 1.

Thanks @Mugen87 I have created a feature request for the same.

I’ve updated the issue at GitHub. I’ve explained there why it’s not possible to implement this feature request.

1 Like