使用 Node.js 在现有 PNG 上写入文本

Question

我正在尝试创建一个简单的动态徽章 (png) 以嵌入静态页面以了解我的应用程序的状态。

我想使用现有的 PNG 图像并使用 Node.js 在其上写一些文本。
我发现了很多库，但它们都使用 Imagemagick 或 Cairo 作为本机依赖项，我想避免在服务器上安装任何其他东西。

然后我找到了 lwip，但我真的不明白如何用它在图像上写文字。 我能怎么做？

Answer 1

你可以使用Jimp 。 它有一个打印方法：

var Jimp = require("jimp");

var fileName = 'test.png';
var imageCaption = 'Image caption';
var loadedImage;

Jimp.read(fileName)
    .then(function (image) {
        loadedImage = image;
        return Jimp.loadFont(Jimp.FONT_SANS_16_BLACK);
    })
    .then(function (font) {
        loadedImage.print(font, 10, 10, imageCaption)
                   .write(fileName);
    })
    .catch(function (err) {
        console.error(err);
    });

Answer 2

如果你想使用ttf文件，你可以使用gm这也会自动对齐文本，这样你就不必跟踪你的字母大小/位置。

const gm = require('gm').subClass({imageMagick: true});


gm('path/to/image.png')
        .fill("#FFFFFF")
        .font("./font.ttf", 20)
        .drawText(15, 10, "your text", 'southeast') //can be any location
        .write("./output.png", function (err) {
            if (!err) console.log('done');
        });