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

wx.getImageInfo({
 src: liveImg, //网络图片
 success(res) {
  var avatarurl_width = 30; //绘制的头像宽度
  var avatarurl_heigth = 30; //绘制的头像高度
  var avatarurl_x = 5; //绘制的头像在画布上的位置
  var avatarurl_y = 5; //绘制的头像在画布上的位置
  ctx.save();
  ctx.beginPath(); //开始绘制
  //先画个圆 前两个参数确定了圆心 （x,y） 坐标 第三个参数是圆的半径 四参数是绘图方向 默认是false，即顺时针
  ctx.arc(avatarurl_width / 2 + avatarurl_x, avatarurl_heigth / 2 + avatarurl_y, avatarurl_width / 2, 0, Math.PI *2, false);
  ctx.closePath()
  ctx.clip(); //画好了圆 剪切 原始画布中剪切任意形状和尺寸。一旦剪切了某个区域，则所有之后的绘图都会被限制在被剪切的区域内 这也是我们要save上下文的原因
  ctx.drawImage(res.path, avatarurl_x, avatarurl_y, avatarurl_width, avatarurl_heigth); // 推进去图片，必须是https图片
  ctx.restore(); //恢复之前保存的绘图上下文 恢复之前保存的绘图上下午即状态 还可以继续绘制
  ctx.draw(true)
},fail() {
  console.log（“失败”）
 }
})