canvas裁剪

Posted corn林

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了canvas裁剪相关的知识,希望对你有一定的参考价值。

clip(),在画布内使用路径,只绘制该路径内所包含区域的图像,不会只路径外的图像。

var canvas = document.getElementById(‘canvas‘);
var context = canvas.getContext(‘2d‘);

context.arc(160,160,150,0,2*Math.PI);
context.fillStyle = ‘#fff‘;
context.fill();
context.clip();

context.fillStyle = ‘rgba(280,187,186,1)‘;
context.fillRect(10,10,300,300);//显示半径为150的粉色圆

 

以上是关于canvas裁剪的主要内容,如果未能解决你的问题,请参考以下文章

如何从 RCNN 中裁剪分割的对象?

canvas图像裁剪压缩旋转

canvas裁剪图片,蒙版选择框

canvas裁剪

从web图片裁剪出发:了解H5中的canvas

使用canvas进行图片裁剪简单功能