title: How to use the three.js SSAO shader?
body: <p>I'm trying to render a scene with the SSAO post-processing shader. There aren't any errors but I can't see any difference between the scene rendered with and without the SSAO pass. I initialize the renderer like this:</p>
  
  <pre><code>// Create WebGL Renderer
  var renderParameters = { antialias: false, alpha: false, clearColor: 0xFFFFFF };
  renderer = new THREE.WebGLRenderer(renderParameters);
  renderer.autoClear = false;
  renderer.setSize(viewportWidth, viewportHeight);
  
  // Create render targets
  renderTargetParametersRGB = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter, format: THREE.RGBFormat };
  renderTargetParametersRGBA = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter, format: THREE.RGBAFormat };
  depthTarget = new THREE.WebGLRenderTarget(width, height, renderTargetParametersRGBA);
  colorTarget = new THREE.WebGLRenderTarget(width, height, renderTargetParametersRGB);
  
  // The shader pass to draw the scene
  var renderScenePass = new THREE.RenderPass(scene, camera);
  
  // Copy to screen render pass
  var copyToScreenPass = new THREE.ShaderPass(THREE.CopyShader);
  copyToScreenPass.renderToScreen = true;
  
  // SSAO render pass
  effectSSAO = new THREE.ShaderPass(THREE.SSAOShader);
  effectSSAO.uniforms['tDepth'].texture = depthTarget;
  effectSSAO.uniforms['size'].value.set(width, height);
  effectSSAO.uniforms['cameraNear'].value = camera.near; // 1
  effectSSAO.uniforms['cameraFar'].value = camera.far;  // 1000
  //effectSSAO.uniforms.onlyAO.value = 1;
  
  // Setup post processing chain
  composer = new THREE.EffectComposer(renderer, colorTarget);
  composer.addPass(effectSSAO);
  composer.addPass(copyToScreenPass); 
  
  // Depth pass
  depthPassPlugin = new THREE.DepthPassPlugin();
  depthPassPlugin.renderTarget = depthTarget;
  renderer.addPrePlugin(depthPassPlugin);
  </code></pre>
  
  <p>In the render function, I render the scene like this:</p>
  
  <pre><code>requestAnimationFrame(render);
  depthPassPlugin.enabled = true;
  renderer.render(scene, camera, composer.renderTarget2, true);
  depthPassPlugin.enabled = false;
  composer.render(0.1);
  </code></pre>
  
  <p>As I said before, everything seems to work fine, but there is no AO effect visible on the screen. Maybe I'm just using the wrong parameter values? I already made sure that the depth pass is updated by rendering the depthTarget to the sceen. If I turn effectSSAO.uniforms.onlyAO.value on, I get a pretty "flat" brownish rendering of the actual scene (including textures), but still no AO. Can somebody give me an advice what to try next?</p>