After looking at the lens flares example here: ,
I'm encountering an issue with post-processing this particular scene. The blocks display correctly, but the light sources and lens flares are missing. Additionally, I am receiving several warnings in the console like: copyTexImage2D: framebuffer is incompatible format. While comparing my code, I noticed that I have added the following snippets to the init()
and render()
loop:
// init()
//
// Post Processing (
//
var rtParameters = {
minFilter: THREE.LinearFilter,
magFilter: THREE.LinearFilter,
format: THREE.RGBFormat,
stencilBuffer: true
};
// Vignette scene.
var shaderVignette = THREE.VignetteShader;
var effectVignette = new THREE.ShaderPass(shaderVignette);
effectVignette.uniforms[ "offset" ].value = 0.95;
effectVignette.uniforms[ "darkness" ].value = 1.6;
// What are these??
var clearMask = new THREE.ClearMaskPass();
var renderMask = new THREE.MaskPass(scene, camera);
effectVignette.renderToScreen = true;
// Render entire scene as a texture.
var renderModel = new THREE.RenderPass(scene, camera);
// renderModel.clear = false;
// Notice: Takes *entire* canvas.
composerScene = new THREE.EffectComposer(renderer,
new THREE.WebGLRenderTarget(width, height, rtParameters));
composerScene.addPass(renderModel);
composerScene.addPass(clearMask);
// Not sure what this does... renderTarget2 is the buffer we read from...
renderScene = new THREE.TexturePass(composerScene.renderTarget2);
// Add first composer -- don't add any passes except for renderScene.
composer1 = new THREE.EffectComposer(renderer,
new THREE.WebGLRenderTarget(width / 2, height, rtParameters));
composer1.addPass(renderScene);
composer1.addPass(effectVignette);
// Add second composer -- do image processing passes here.
composer2 = new THREE.EffectComposer(renderer,
new THREE.WebGLRenderTarget(width / 2, height, rtParameters));
composer2.addPass(renderScene);
composer2.addPass(effectVignette);
renderScene.uniforms[ "tDiffuse" ].value = composerScene.renderTarget2;
And within my render loop, the setup is as follows:
//render()
// Set view port to entire region
renderer.setViewport(0, 0, width, height);
renderer.clear();
composerScene.render(delta);
// Render original scene.
renderer.setViewport(0, 0, width / 2, height);
composer1.render(delta);
// Render modified scene.
renderer.setViewport(width / 2, 0, width / 2, height);
composer2.render(delta);