canvas使用注意点

1、canvas.arc();方法画圆时,最后一个参数默认为false,false为顺时针,当为true时,为顺时针
如果想画一个1/4圆,需要结合lineTo()方法
canvas.beginPath();
canvas.arc(100,100,50,0,Math/2);
canvas.lineTo(100,100);
canvas.closePath();

2、canvas.createPattern(image,repeatStyle);位图填充
第二个参数可为repeat、repeat-x、repeat-y、no-repeat,默认为repeat。虽然有默认值,但是第二个参数不可缺省,否则会报错。

3、使用canvas.clip()可以对位图(就是图片,包括drawImage()、createPattern()导入的图片)实现裁剪功能。clip()方法无论放在位图显示代码的上面还是下面,都可以对位图进行裁剪。
注意:使用canvas.save();和canvas.restore();方法,可以略去clip()的设置
canvas.save();
canvas.arc(...);
canvas.clip();		//此时的clip()设置不发生作用
canvas.restore();
canvas.drawImage(...);

猜你喜欢

转载自blog.csdn.net/mooncom/article/details/80240158