微信小程序canvas绘制圆觉圆角角片

/**
   * 微信小程序canvas绘制圆觉圆角角片
   * @param 图片宽 imageWidth 
   * @param 图片高 imageHeight 
   * @param x坐标 pointX 
   * @param y坐标 pointY 
   * @param 图片路径 iamgePath 
   */
  drawRoundImage(imageWidth,imageHeight,pointX,pointY,imageCorner,iamgePath,ctx){
     
    console.log(imageWidth)
    console.log(imageHeight)
    console.log(pointX)
    console.log(pointY)
    console.log(imageCorner)
    console.log(iamgePath)

    // 绘制海报背景图片圆角
     ctx.save()
     ctx.beginPath()
     ctx.arc(pointX + imageCorner, pointY + imageCorner, imageCorner, Math.PI, Math.PI * 1.5)
     ctx.arc(pointX + imageWidth - imageCorner, pointY + imageCorner, imageCorner, Math.PI * 1.5, Math.PI * 2)
     ctx.arc(pointX + imageWidth - imageCorner, pointY + imageHeight - imageCorner, imageCorner, 0, Math.PI * 0.5)
     ctx.arc(pointX + imageCorner, pointY + imageHeight - imageCorner, imageCorner, Math.PI * 0.5, Math.PI)
     ctx.clip()
     ctx.drawImage(iamgePath, pointX, pointY, imageWidth, imageHeight)
     // 恢复之前保存的绘图上下文
     ctx.restore()
  }

示例：

 //绘制顶部头像 4个像素的图片圆角
this.drawRoundImage(40,40, baseLeft, baseTop,5,this.data.avatarPath,ctx)