title: THREE.js blur the frame buffer
body: <p>I need to blur the frame buffer and I don't know how to get the frame buffer using THREE.js.</p>
  
  <p><strong>I want to blur the whole frame buffer rather than blur each textures in the scene.</strong> So I guess I should read the frame buffer and then blur, rather than doing this in shaders.</p>
  
  <p>Here's what I have tried:</p>
  
  <p>Call when init:</p>
  
  <pre><code>var renderTarget = new THREE.WebGLRenderTarget(512, 512, {
      wrapS: THREE.RepeatWrapping,
      wrapT: THREE.RepeatWrapping,
      minFilter: THREE.NearestFilter,
      magFilter: THREE.NearestFilter,
      format: THREE.RGBAFormat,
      type: THREE.FloatType,
      stencilBuffer: false,
      depthBuffer: true
  });
  renderTarget.generateMipmaps = false;
  </code></pre>
  
  <p>Call in each frame:</p>
  
  <pre><code>var gl = renderer.getContext();
  
  // render to target
  renderer.render(scene, camera, renderTarget, false);
  framebuffer = renderTarget.__webglFramebuffer;
  console.log(framebuffer);
  
  gl.flush();
  if (framebuffer != null)
      gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
  var width = height = 512;
  var rdData = new Uint8Array(width * height * 4);
  gl.readPixels(0, 0, width, height, gl.RGBA, gl.UNSIGNED_BYTE, rdData);
  console.log(rdData);
  
  // render to screen
  renderer.render(scene, camera);
  </code></pre>
  
  <p>But <code>framebuffer</code> is <em><code>WebFramebuffer {}</code></em> and <code>rdData</code> is full of <code>0</code>. Am I doing this in the right way?</p>