节点 gm 水印和调整大小

Posted 2023-03-06

【中文标题】节点 gm 水印和调整大小

【英文标题】：node gm watermark and resize

【发布时间】：2016-12-02 19:32:41

【问题描述】：

大家晚上好。

我正在使用带有 imagemagick 的节点 gm 库进行图像处理。我的目的是以这样一种方式处理图像，将其调整为 2048 高度/宽度（保持纵横比），并在右下角使用 256x256 图像进行水印。

我实际上是在构建一个与社交媒体集成的在线图库，这样可以上传完整尺寸的图像，并且每个相关社交网络都有一个“最佳尺寸”图像，上面有水印。

我遇到了一些麻烦，这是我当前用于调整 facebook 大小的代码；

gm(origLoc)
    .resize(2048, null)
    .command('composite')
    .gravity('SouthEast')
    .out('-geometry', '+20+10')
    .in(waterMarkFile_Location)
    .write(thisFile.destination + "rsz/FB/"+newFileName, function(err, stdout, stderr, command)
        if (err)
            console.log("Err in FB");
            console.log(err);
        
    );

它输出一个 2048 像素宽的图像，保持比例，但问题是水印被缩放，覆盖了整个图像。

如果我删除或评论 resize 行，它会像您期望的那样添加水印，但不会将整个图像调整为 2048 像素，保持原始图像尺寸。

我已经与它斗争了很长一段时间，尝试了许多解决方案，我似乎得到了这种可怕的权衡。有人可以帮忙吗？

【问题讨论】：

我想你只需要改变顺序，把composite after in。基本上，你必须加载原件并调整大小，设置重力和几何形状，加载水印，然后合成并保存。

@MarkSetchell 刚试了一下，调整为2048，水印覆盖整个图片

您的水印有多大？使用identify watermark.png

它是 11KB，256x256px，PNG 格式。

好的，试试这个顺序...load original... resize... load watermark... gravity southeast... geometry +20+10... composite... save

【参考方案1】：

我之前的解决方案依靠.size 函数来计算水印位置的尺寸。我已经调整了这个函数，所以它现在使用gravity定位在右下角；

gm(_image)
    // WATERMARK - PARAM ORDER: [X Pos, Y Pos, width, height]
    .draw(['gravity SouthEast image Over 0,0 256,256 "/path/to/watermark.png"'])
    // RESIZE DIMENSIONS - PARAM ORDER: [width, height]
    .resize(2048, null)
    .write("/path/to/resized/output.jpg", function(err, stdout, stderr, command)
        if (err)
            return cb(err);
        
        return cb("done");
    );

256 是我的水印所需的宽度和高度。 .draw 上方的注释说明了这些值的顺序 - 如果使用 gravity 设置位置，这些是偏移量，可以是负数。

在本例中，水印将位于右下角。

首先，你需要.draw图片上的水印。

其次，你需要根据你想要的输出尺寸.resize。

最后，你然后.write（或.stream）到你的输出目的地。

编辑 - 2016 年 12 月 2 日星期五 23:21

我现在构建了一个功能，可以让您调整最长边的大小，并选择是否要为其添加水印 - 我想如果您正在寻找类似的东西，我向您打招呼“你好！”，人们未来！

function processImgLongEdge(_image, _outputDest, _maxLongEdge, watermark, cb)
    var gm  =   require("gm").subClass(imageMagick: true);
    if (watermark == true)
        gm(_image).size(function(err, value)
            var isLandscape;
            if (value.width > value.height)
                isLandscape =   true;
             else 
                isLandscape = false;
            
            if (isLandscape == true)
                gm(_image)
                    .draw(['gravity SouthEast image Over 0,0 256,256 "/full/path/to/watermark.png"'])
                    .resize(_maxLongEdge, null)
                    .write(_outputDest, function(err, stdout, stderr, command)
                        if (err)
                            return cb(err);
                        
                        return cb("done");
                    );
             else 
                gm(_image)
                    .draw(['gravity SouthEast image Over 0,0 256,256 "/full/path/to/watermark.png"'])
                    .resize(null, _maxLongEdge)
                    .write(_outputDest, function(err, stdout, stderr, command)
                        if (err)
                            return cb(err);
                        
                        return cb("done");
                    );
                
            );
         else 
            gm(_image).size(function(err, value)
                var isLandscape;
                if (value.width > value.height)
                    isLandscape =   true;
                 else 
                    isLandscape = false;
                
                if (isLandscape == true)
                    gm(_image)
                        .resize(_maxLongEdge, null)
                        .write(_outputDest, function(err, stdout, stderr, command)
                            if (err)
                                return cb(err);
                            
                            return cb("done");
                        );
                 else 
                    gm(_image)
                        .resize(null, _maxLongEdge)
                        .write(_outputDest, function(err, stdout, stderr, command)
                            if (err)
                                return cb(err);
                            
                            return cb("done");
                        );
                
            );
        
;

要使用它，只需使用它并根据需要进行配置；

processImgLongEdge(
    "/path/to/input/image.jpg",         // Path to original image
    "/path/to/output/image.jpg",        // Path to output image
    600,                                // Max length of longest edge
    false,                              // Should it have a watermark? <true | false>
    function(imgResult)
        console.log(imgResult);         // Will log "done" or error from gm to the console
    
);

该功能可能可以通过某些方式进行调整，但如果您正在寻找“它只是工作”的解决方案，就是这样。

如果您愿意，可以通过一些调整使其沿最短边调整大小，但这不是我的项目所需要的，所以我不会在这里介绍。