收藏
回答

CanvasContext.arc/clip画圆形头像,切不完整

框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
小程序 Bug CanvasContext.arc 客户端 7.0.3 2.6.1

- 当前 Bug 的表现(可附上截图)


- 预期表现

头像应该切成圆的啊。不知道是CanvasContext.arc的问题还是CanvasContext.clip的问题还是啥问题

- 复现路径


- 提供一个最简复现 Demo




回答关注问题邀请回答
收藏

3 个回答

  • 邱一欢
    邱一欢
    2019-03-05

    你在 ctx.clip() 前面先调用下ctx.fill() 试试


    2019-03-05
    有用 2
    回复 2
    • 邱一欢
      邱一欢
      2019-03-05

      另外canvas是不支持 网路路径的图片 需要先下载到本地才能用。 https://developers.weixin.qq.com/s/FUKJaDm17D6r 这个是我们公司的绘制分享图片的代码 你参考下吧

      2019-03-05
      1
      回复
    • 2019-03-05回复邱一欢

      可以的,非常感谢啊

      2019-03-05
      回复
  • 欢乐马
    欢乐马
    2020-04-20
    context.save()
      context.moveTo(x, y + r)
      context.arc(x + r, y + r, r, 0, 2.1 * Math.PI)
      // context.fill(); //无效
      // context.closePath()//无效
      context.clip()
      context.drawImage(img, x, y, 2 * r, 2 * r)
      context.restore()
    

    moveTo将画笔移动到你绘制到起点上。

    2020-04-20
    有用
    回复
  • 2019-03-05

    还有官方能不能出一个将页面绘制成canvas以便分享到朋友圈的组件啊?感觉这需求还是挺常用的,由canvas功底不好的自己来写还真的是痛苦

    2019-03-05
    有用
    回复
登录 后发表内容