node.js - 使用 Jimp 将图像放在其他图像上

Question

我正在尝试在服务器端工作的 node.js 应用程序上编辑我的图像。此刻，我已经成功地在我的图像上添加了文字。我想在这张图片的左上角放置一个绿色矩形，我试过这个方法:

    Jimp.read(`borderTop.png`, function (err, top) {
        top.rotate(45);
        Jimp.read(`img.png`, function (err, image) {
            if (err) console.log(err);
            image.blit(top, 430, -250);
            Jimp.loadFont(`${__dirname}/../public/fonts/*.fnt`).then(function (font) {
                image.print(font, 315 - ((16 * 13 ) / 2), 0, "Hello, world!");
                image.write(finalName, (err) => {
                    return cb(null, `img.png`);
                });
            });
        });
    });

这是可行的，但它会删除边框下方的部分图像。

我试过了:

• 仅使用.png 文件
• 为我的图片添加不透明度
• 仅使用具有 alpha channel 的图像

Answer 1

要让它工作，你必须使用:

image.composite( src, x, y );     // composites another Jimp image over this image at x, y 

来自 jimp doc

因为 image.blit() 只是删除图像下的所有内容。