绘制圆角头像
发布于 6 年前 作者 xiulan46 11161 次浏览 来自 问答

用 drawImage 在 canvas 里加入用户头像，请问怎么把头像绘制成圆角?多谢了！

10 回复

circleImg(ctx, img, x, y, r) {    ctx.save();    var d =2 * r;    var cx = x + r;    var cy = y + r;    ctx.arc(cx, cy, r, 0, 2 * Math.PI);    ctx.clip();    ctx.drawImage(img, x, y, d, d);    ctx.restore();  }

哈哈~  那也是临时方案！   我在 setshadow 后咋不起作用？兄台的是怎么设置 border 和 shadow 的？

哇~  我们是服务端合成下发的！然后现在微信新版本fix 掉这个问题了，我们就想放在前端来做这个事！你那边也加了border 和 shadow吗，求仁兄分享！

就只有这一段代码吗？有详细点的代码吗？

这个很容易理解了。。。还要多详细啊。

ctx.setFillStyle('red')
ctx.setShadow(10, 50, 50, 'blue')
ctx.fillRect(10, 10, 150, 75)
ctx.draw()

你好， 有实例代码？

真好啊。我们是前端自己生成的。

多谢，可以啦，

我以前也是这样做的啊 可是 微信客户端有两个版本有问题 ，保存不了图片，我们就先隐藏掉这个功能了

回到顶部