我在搞乱 HTML5 画布和剪辑。我想知道如何让用户点击画布,让它剪一个圆圈,然后重复。所以本质上,用户可以点击多次,就会有多个剪辑。
我尝试了一些与我想要的稍微相似的解决方案,但它不起作用。
这是剪辑代码:
context.save();
context.beginPath();
context.arc(mouseX,mouseY,50,50,Math.PI*2,true);
context.globalCompositeOperation = 'destination-out';
context.clip();
context.closePath();
var img = new Image();
img.src = canvasSnowflake.toDataURL();
context.drawImage(canvasSnowflake, 0, 0);
context.restore();
你可以在这里查看整个操作:http: //jsfiddle.net/cnbishop/8FzuB/。现在您可以单击一次并且剪辑可以工作,但是如果您再次单击画布,您可以获得一个新剪辑。这甚至可能吗?