节点gm水印并调整大小

时间:2016-12-02 19:32:42

标签: node.js imagemagick

晚上好。

我正在使用带有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像素,从而维持原始图像尺寸。

我已经与它斗争了很长一段时间,尝试了很多解决方案,而且我似乎正在进行这种可怕的权衡。有人可以帮忙吗?

1 个答案:

答案 0 :(得分:3)

我之前的解决方案依赖于.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

我现在已经建立了一个功能,让你可以调整最长的边缘,并选择是否要为它添加水印 - 我想如果你正在寻找这样的东西,我会问你# 34;你好!",未来的人!

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
    }
);

这个功能可能会在某些方面进行调整,但是如果你正在寻找一个&#39;它只是起作用了。解决方案,就是这样。

通过一些调整,如果你愿意的话,你可以让它沿着最短的边缘进行调整,但这不是我的项目所需要的,所以我不会在这里覆盖它。