nodejs使用canvas一张图片添加不同的文字输出多个图片

可以使用node-canvas库来实现这个功能。

1. 首先安装node-canvas库：npm install canvas

2. 创建一个canvas对象，加载图片：

const { createCanvas, loadImage } = require("canvas");
const canvas = createCanvas(100, 100); // 创建一个100*100的canvas
const ctx = canvas.getContext("2d");
const img = await loadImage("path/to/image.png"); // 加载图片
ctx.drawImage(img, 0, 0); // 绘制图片

3. 给图片添加文字，输出新的图片：

ctx.font = "bold 20px Arial"; // 设置字体样式
ctx.fillText("Hello World", 10, 50); // 添加文字
const outputBuffer = canvas.toBuffer("image/png"); // 转换成buffer
// 将buffer保存成文件或输出到浏览器

4. 将上面的代码封装成一个函数，实现输出多个图片：

async function addTextToImage(imagePath, text, outputFilePath) {
  const { createCanvas, loadImage } = require("canvas");
  const canvas = createCanvas(100, 100);
  const ctx = canvas.getContext("2d");
  const img = await loadImage(imagePath);
  ctx.drawImage(img, 0, 0);
  ctx.font = "bold 20px Arial";
  ctx.fillText(text, 10, 50);
  const outputBuffer = canvas.toBuffer("image/png");
  fs.writeFileSync(outputFilePath, outputBuffer);
}

// 调用函数输出多个图片
addTextToImage("path/to/image1.png", "Text1", "output/image1.png");
addTextToImage("path/to/image2.png", "Text2", "output/image2.png");
addTextToImage("path/to/image3.png", "Text3", "output/image3.png");

这样就可以输出多张添加了不同文字的图片了