title: How to apply a filter to a shape with image fill in KonvaJS?
body: <p>I'm using Konva.js to do some canvas animations. I have circle shapes, with an image fill, and would like to apply a color overlay/filter to the shape (RGBA).</p>
  
  <p>This is how I'm creating the Shape object:</p>
  
  <pre><code>var konvaObject = new Konva.Circle({
      x: 100,
      y: 100,
      radius: 300,
      stroke: this.color,
      strokeWidth: 6,
      fillPatternRepeat: 'no-repeat',
  });
  
  // load the image into the shape:
  var imageObj = new Image();
  imageObj.onload = function () {
      konvaObject.fillPatternImage(imageObj);
      konvaObject.draw();
  }
  imageObj.src = 'www.demo.com/anImageName.png';
  </code></pre>
  
  <p>demo: <a href="http://jsbin.com/winugimeme/edit?js,output" rel="nofollow">http://jsbin.com/winugimeme/edit?js,output</a></p>
  
  <p><a href="http://konvajs.github.io/docs/filters/RGBA.html" rel="nofollow">The Docs outline an RGBA filter</a>, however as far as I can tell it can only be applied to <code>Konva.Image</code> items.</p>
  
  <p>Is there a way to re-work my above code so that I can apply filters to the shape object/fill image?</p>