title: Fabric.js: How to apply filter to entire canvas?
body: <p>While I've seen several methods to apply filters to images, I have yet to see anything that would apply the fabric filter to the entire canvas.</p>
  
  <p>Example of image filter function
  from <a href="http://fabricjs.com/fabric-intro-part-2/" rel="nofollow">http://fabricjs.com/fabric-intro-part-2/</a></p>
  
  <pre><code>fabric.Image.fromURL('pug.jpg', function(img) {
  
    // add filter
    img.filters.push(new fabric.Image.filters.Grayscale());
  
    // apply filters and re-render canvas when done
    img.applyFilters(canvas.renderAll.bind(canvas));
  
    // add image onto canvas
    canvas.add(img);
  });
  </code></pre>
  
  <p>I want to pass in the entire canvas element and all the shapes inside and apply the filter to all. </p>
  
  <p>Do I need to flatten the canvas, convert it to an image, and then apply the filter? The user may make changes afterwards to after flatten and apply, the canvas would have to be decoupled back to 'layers' so the user could continue to edit.</p>
  
  <p>Docs for GreyScale filter. <a href="http://fabricjs.com/docs/symbols/fabric.Image.filters.Grayscale.html" rel="nofollow">http://fabricjs.com/docs/symbols/fabric.Image.filters.Grayscale.html</a></p>