drawCanvas(mapName, fullSteps) {
    // wx.createSelectorQuery().select('#cert').fields({
    //   node: true,
    //   size: true
    // }).exec(res => {
    const dpr = wx.getSystemInfoSync().pixelRatio;
    const widthRatio = wx.getSystemInfoSync().windowWidth / 375;
    const width = wx.getSystemInfoSync().windowWidth * dpr;
    const height = wx.getSystemInfoSync().windowHeight * dpr;
    const canvas = wx.createOffscreenCanvas({
      type: '2d',
      width: wx.getSystemInfoSync().windowWidth * dpr,
      height: wx.getSystemInfoSync().windowHeight * dpr
    });
    const ctx = canvas.getContext('2d');
    ctx.scale(dpr, dpr);
    ctx.scale(widthRatio, widthRatio);
    let bg = canvas.createImage();
    bg.src = '../../../images/cert-bg.jpg';
    bg.onload = () => {
      // 绘制背景图
      ctx.drawImage(bg, 0, 0, canvas.width / dpr, canvas.height / dpr);
      // 头部文字
      ctx.fillStyle = "#777873";
      ctx.font = "14px 'PingFang SC'";
      ctx.fillText('健行四季｜悦动人生', 123, 146);
      ctx.font = "16px 'PingFang SC'";
      ctx.fillText('2021年中国人寿“700健行”活动', 73, 163);
      ctx.font = "36px 'PingFang SC'";
      ctx.fillStyle = "#0B3836";
      ctx.fillText('风景线路完成证书', 44, 206);

      // 地图信息文字
      ctx.font = "bold 18px 'PingFang SC'";
      ctx.textAlign = 'center';
      ctx.fillStyle = "#0B3836";
      ctx.fillText(`${mapName}风景线 全程${fullSteps}步`, 375 / 2, 346);

      // 详细信息背景
      ctx.beginPath();
      ctx.moveTo(47, 385);
      ctx.lineTo(47, 547);
      ctx.arc(57, 547, 10, Math.PI, Math.PI / 2, true);
      ctx.lineTo(318, 557);
      ctx.arc(318, 547, 10, Math.PI / 2, 0, true);
      ctx.lineTo(328, 385);
      ctx.arc(318, 385, 10, 0, 1.5 * Math.PI, true);
      ctx.lineTo(57, 375);
      ctx.arc(57, 385, 10, 1.5 * Math.PI, Math.PI, true);
      ctx.fillStyle = "#CDDDDA";
      ctx.fill();
      ctx.closePath();

      // 详细信息
      ctx.fillStyle = "#9AACAB";
      ctx.textAlign = 'left';
      ctx.font = "bold 14px 'PingFang SC'";
      ctx.fillText('完成者：', 64, 402);
      ctx.fillText('完成时间：', 64, 432);
      ctx.fillText('完成时长：', 64, 462);
      ctx.fillStyle = "#316C6A";
      ctx.fillText(wx.getStorageSync('userInfo').nickName, 140, 402);
      ctx.fillText('2021.06.21', 140, 432);
      ctx.fillText('04:36:22', 140, 462);
      ctx.fillText(`11.00 km    ${fullSteps}步`, 64, 502);
      ctx.fillText(`${mapName}风景线`, 64, 532);

      // 完成图片
      const finish = canvas.createImage();
      finish.src = '../../../images/finished.png';
      finish.onload = () => {
        ctx.drawImage(finish, 224, 456, 136, 136);
      }

      // 公司logo
      const logo = canvas.createImage();
      logo.src = '../../../images/chinalife-logo.png';
      logo.onload = () => {
        ctx.drawImage(logo, 108, 94, 160, 28);
      }

      // 用户头像
      const avatar = canvas.createImage();
      avatar.src = wx.getStorageSync('userInfo').avatarUrl;
      avatar.onload = () => {
        ctx.save();
        ctx.arc(188, 276, 36, 0, 2 * Math.PI);
        ctx.clip();
        ctx.drawImage(avatar, 152, 240, 72, 72);
        ctx.restore();
        console.log(canvas);
        wx.canvasToTempFilePath({
          canvas: canvas,
          x: 0,
          y: 0,
          width,
          height,
          destWidth: width,
          destHeight: height,
          success: res => {
            console.log(res);
          }
        }, this)
      }
    }

以上是代码片段，报错信息如下

这里的意思是需要我传入离屏canvas 但是我传入了依旧报错