title: How do I clip a image obtained from the getImageData() function?
body: <p>I'm trying to get the contents of a source canvas, clip it, and then draw it on another canvas. Even though my code works like a charm using a src PNG / new Image() combo, it does not when the source content comes from another canvas. </p>
  
  <p>the code is:</p>
  
  <pre><code>var imgData = src_ctx.getImageData(x, y, w, h);
  dest_ctx.putImageData(imgData, x, y+h);
  
  ctx.beginPath(); // Filled triangle
  ctx.moveTo(x1,y1);
  ctx.lineTo(x2,y2);
  ctx.lineTo(x2,0);
  ctx.lineTo(x1,0);               
  ctx.clip();
  </code></pre>