canvas 合并图片和文字

代码

  async getImgInfo(img, text) {
    return new Promise((resolve, reject) => {
      const canvas = document.createElement("canvas");
      canvas.width = 52;
      canvas.height = 68;
      const ctx = canvas.getContext("2d");
      ctx.rect(0, 0, canvas.width, canvas.height);
      const image = new Image();
      image.src = img;
      image.onload = () => {
        ctx.drawImage(image, 0, 0);
        // 设置字体样式
        ctx.font = "20px Arial";
        ctx.fillStyle = "white"; // 文字颜色
        ctx.textAlign = "center";

        // 绘制文字
        ctx.fillText(text, canvas.width / 2, canvas.height / 2);
        let base64 = canvas.toDataURL("image/png");
        resolve(base64);
      };

    });
  },