晚上好。
我正在使用带有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像素,从而维持原始图像尺寸。
我已经与它斗争了很长一段时间,尝试了很多解决方案,而且我似乎正在进行这种可怕的权衡。有人可以帮忙吗?
答案 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;它只是起作用了。解决方案,就是这样。
通过一些调整,如果你愿意的话,你可以让它沿着最短的边缘进行调整,但这不是我的项目所需要的,所以我不会在这里覆盖它。