微信小程序如何使用canvas实现绘制一个圆形的png图片？

canvasContext.drawImage只能改变图片大小，位置，并不能改变图片展现形状，请问如何解决？

2 回复

jjin1 楼6 年前

好的！已经解决了。谢谢！

xiulan172 楼6 年前

var ctx = wx.createCanvasContext(‘myCanvas’);

ctx.beginPath();

ctx.arc(30, 30, 26.5, 0, 2 * Math.PI);

ctx.setLineWidth(6)

ctx.setStrokeStyle(‘描边颜色’)

ctx.stroke();//画空心圆

ctx.closePath();

ctx.save();

ctx.arc(30, 30, 25, 0, 2 * Math.PI)

ctx.clip(); //裁剪上面的圆形

ctx.drawImage(‘图片’, 0, 0, 60, 60);

ctx.draw();

小程序如何绘制一个圆形图片？