wx 画布图片

drawimg() {

      let ctx = wx.createCanvasContext("标签ID", this);

      // 背景
      ctx.beginPath();
      ctx.drawImage("/static/images/bg.png", 0, 0, rpx2px(750), rpx2px(1020));
      ctx.beginPath();
      ctx.drawImage(
        "/static/images/bgCard.png",
        rpx2px(70),
        rpx2px(79),
        rpx2px(605),
        rpx2px(860)
      );
      // 用户头像
      ctx.save();

      ctx.beginPath();
      ctx.arc(rpx2px(163), rpx2px(162), rpx2px(40), 0, 2 * Math.PI);
      ctx.clip();
      ctx.drawImage(
        this.$mp.query.urlImg,
        rpx2px(123),
        rpx2px(122),
        rpx2px(80),
        rpx2px(80)
      );
      ctx.restore();

      // 用户信息
      ctx.beginPath();
      ctx.setFillStyle("#333");
      ctx.setFontSize(rpx2px(28));
      ctx.setTextAlign("left");
      ctx.setTextBaseline("middle");
      ctx.fillText(
        businessName.length > 12
          ? businessName.slice(0, 12) + "..."
          : businessName,
        rpx2px(229),
        rpx2px(147)
      );

      //字体定位 可兼容
      ctx.beginPath();
      ctx.setFillStyle("#999");
      ctx.setFontSize(rpx2px(26));
      ctx.setTextAlign("left");
      ctx.setTextBaseline("middle");
      ctx.fillText("招人啦，等你来报名～", rpx2px(229), rpx2px(185));


      ctx.beginPath();
      ctx.setFillStyle("#333");
      ctx.setFontSize(rpx2px(42));
      ctx.setTextAlign("center");
      ctx.setTextBaseline("middle");
      ctx.fillText(
        name.length > 10 ? name.slice(0, 10) + "..." : name,
        rpx2px(375),
        rpx2px(321)
      );

      ctx.beginPath();
      ctx.setFillStyle("#DD3740");
      ctx.setFontSize(rpx2px(36));
      ctx.setTextAlign("center");
      ctx.setTextBaseline("middle");
      ctx.fillText(reward, rpx2px(375), rpx2px(390));

      let oddIndex = 0;
      let lengthlist = welfare.split(",").slice(0, 3) || [];
      let lengthPx =
        lengthlist.length == 1
          ? 306
          : lengthlist.length == 2
            ? 225
            : lengthlist.length == 3
              ? 156
              : 0;

      welfare &&
        welfare.length > 0 &&
        lengthlist.map(item => item.substr(0, 5)).forEach((item, index) => {
          ctx.beginPath();
          ctx.setFillStyle("#F3F2F7");
          ctx.fillRect(
            rpx2px(lengthPx + 150 * oddIndex),
            rpx2px(459),
            rpx2px(140),
            rpx2px(49)
          );
          ctx.setFontSize(rpx2px(28));
          ctx.setFillStyle("#666");
          ctx.setTextAlign("center");
          ctx.fillText(
            item,
            rpx2px(140 / 2 + lengthPx + 150 * oddIndex),
            rpx2px(488)
          );

          ctx.closePath();
          oddIndex++;
        });

      // 二维码
      if (url) {
        ctx.beginPath();
        ctx.drawImage(
          this.$mp.query.urlQR,
          rpx2px(267),
          rpx2px(586),
          rpx2px(200),
          rpx2px(200)
        );
      }

      ctx.draw(false, () => {
        setTimeout(() => {
          wx.canvasToTempFilePath({
            x: 0,
            y: 0,
            canvasId: "标签ID",
            quality: 1,
            success: res => {
              const { tempFilePath } = res;
              this.tempFilePath = tempFilePath;
            }
          });
        }, 500);
      });
    }
  },


//保存图片


saveImg() {
      console.log(this.tempFilePath, 5555);
      const tempFilePath = this.tempFilePath;
      let that = this;
      wx.showLoading({
        title: "正在保存"
      });
      try {
        await wxFn.wxSaveImageToPhotosAlbum({
          filePath: tempFilePath
        });
        wx.showToast({
          title: "已保存至本地相册",
          icon: "none",
          duration: 3000
        });
        wx.navigateBack({
          delta: 1
        });
        // this.hideCanvas();
      } catch (error) {
        console.log(676, error);
        if (error.errMsg === "saveImageToPhotosAlbum:fail cancel") {
          wx.showToast({
            title: "您已取消保存",
            icon: "none",
            duration: 3000
          });
          wx.hideLoading();
        } else if (
          error.errMsg === "saveImageToPhotosAlbum:fail file not exists"
        ) {
          wx.hideLoading();
          wx.saveImageToPhotosAlbum({
            filePath: tempFilePath
          });
        } else {
          wx.hideLoading();
          wx.showModal({
            title: "",
            content: "您未开启保存图片到相册的权限,请点击确定去开启权限!",
            success: res => {
              if (res.confirm) {
                wx.openSetting({
                  async success(power) {
                    if (power.authSetting["scope.writePhotosAlbum"]) {
                      that.drawimg();
                      that.saveImg();
                    }
                  }
                });
              }
            }
          });
        }
      }
    },