剪切图像内的形状与目的地

context.globalCompositeOperation = "destination-in"

“destination-in”合成剪辑新形状内的现有图形。

注意:现有图形中位于新图形之外的任何部分都将被删除。

context.drawImage(picture,0,0);
context.globalCompositeOperation='destination-in';  // picture clipped inside oval
context.drawImage(oval,0,0);

StackOverflow 文档