[移动开发]微信小程序 分享的图片使用canvas生成

wxml：

<canvas type="2d" id="canvas"></canvas>

js：

wx.getImageInfo({
 src:“”, // 这里填写网络图片路径 
  success: (res) => {
    this.clipImage(res.width, res.height)
  }
})
// 裁剪图片
clipImage(imgW, imgH) {
  new Promise((resolve, reject) => {
    let canvasH = imgH;    // 获取图片高度
    let canvasW = imgH * 4 / 5;  // 根据图片高度 获取对应的高度
    const query = wx.createSelectorQuery();
    query.select('#canvas')
      .fields({
        id: true,
        node: true,
        size: true
      })
      .exec(async (res) => {
        const canvas = res[0].node
        const ctx = canvas.getContext('2d')
        canvas.width = canvasW
        canvas.height = canvasH
        let seal = canvas.createImage();
        seal.src = this.data.activityDetail.pic_url;
        seal.onload = () => {
          ctx.drawImage(seal, (imgW - canvasW) / 3, 0, canvas.width * 1.55, canvas.height * 1.55, 0, 0, canvas.width, canvas.height);
          wx.canvasToTempFilePath({
            canvas: canvas,
            success: (res) => {
              this.path = res.tempFilePath  // 转发的图片
              resolve()
            },
            fail(res) {
              console.log(res);
            }
          }, this)
        }
      })
  })
}

微信文档好乱！！