调整大小和裁剪图像并保持纵横比 NodeJS & gm

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/21591536/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-09-02 16:48:21  来源:igfitidea点击:

Resize and crop image and keeping aspect ratio NodeJS & gm

node.jsgraphicsmagick

提问by user3277539

I've been trying to create some thumbnails using the gmpackage from NodeJS, but I'm out of lucky. I need to resize images bigger than 600x600 (could be any width/height, starting from the given one) but when I pass the size to gm, it creates an image that doesn't have the same size I requested.

我一直在尝试使用gmNodeJS的包创建一些缩略图,但我很不走运。我需要调整大于 600x600 的图像(可以是任何宽度/高度,从给定的开始)但是当我将尺寸传递给 gm 时,它创建的图像与我要求的尺寸不同。

For example, given this code, I assume that running node app /path/to/image.pngI'll receive an image with size of 200x100, but instead I got, say, an image of 180x100 or 200x90...

例如,给定这段代码,我假设运行时node app /path/to/image.png我会收到一个大小为 200x100 的图像,但是我得到了一个 180x100 或 200x90 的图像......

gm(fileLocation)
    .thumb(200, 100, 'processed.' + process.argv[2].split('.').pop(), function() {
        console.log("Done!");
    });

I've also tried with the resize option. There's even an option to force the size, but the aspect ratio of the output goes horrible...

我也尝试过调整大小选项。甚至还有一个选项可以强制调整大小,但是输出的纵横比太可怕了......

gm('/path/to/image.jpg')
    .resize(353, 257)
    .write(writeStream, function (err) {
         if (!err) console.log(' hooray! ');
    });

采纳答案by Patrick D'appollonio

Try with imagemagickpackage for NodeJS: https://github.com/yourdeveloper/node-imagemagick

尝试使用imagemagickNodeJS 包:https: //github.com/yourdeveloper/node-imagemagick

im.crop({
    srcPath: process.argv[2],
    dstPath: 'cropped.' + process.argv[2].split('.').pop(),
    width: 200,
    height: 200,
    quality: 1,
    gravity: 'Center'
}, function(err, stdout, stderr){
    if (err) throw err;
    console.log('resized ' + process.argv[2].split('/').pop() + ' to fit within 200x200px');
});


Update:Please note that the node-imagemagickpackage hasn't been updated in quite a long time. Please consider Freyday's answersince it's most up-to-date.

更新:请注意node-imagemagick包已经很长时间没有更新了。请考虑Freyday 的回答,因为它是最新的。

回答by mikefrey

To achieve a resized, cropped image with a center gravity with the gmmodule, you can use something similar to this:

gm使用模块实现具有中心重心的调整大小的裁剪图像,您可以使用类似于以下内容的内容:

gm('/path/to/image.jpg')
  .resize('200', '200', '^')
  .gravity('Center')
  .crop('200', '200')
  .write(writeStream, function (err) {
    if (!err) console.log(' hooray! ');
  });

The '^'argument on the resizefunction will tell GraphicsMagick to use the height and width as a minimuminstead of the default behavior, maximum. The resulting resized image will have either the width orheight be your designated dimension, while the non-conforming dimension is larger than the specified size.

该函数的'^'参数resize将告诉 GraphicsMagick 使用高度和宽度作为最小值,而不是默认行为,最大值。生成的调整大小的图像的宽度高度将是您指定的尺寸,而不合格的尺寸大于指定的尺寸。

Then gravityfunction tells GraphicsMagick how the following cropfunction should behave, which will crop the image to the final size.

然后gravity函数告诉 GraphicsMagick 以下crop函数应该如何工作,它将图像裁剪为最终尺寸。

You can find detailed documentation for the GraphicsMagick options used by the gmmodule here: http://www.graphicsmagick.org/GraphicsMagick.html

您可以在gm此处找到模块使用的 GraphicsMagick 选项的详细文档:http: //www.graphicsmagick.org/GraphicsMagick.html

回答by Otto

Another solution without external libraries (except by imagemagick) is create your own solution:

另一个没有外部库的解决方案(imagemagick 除外)是创建自己的解决方案:

var exec = require('child_process').exec;

resize = function (image) {
  var cmd = 'convert ' + image.src + 
  ' -resize ' + image.width + 'x' + image.height + '^' + 
  ' -gravity center -crop ' + image.width + 'x' + image.height + '+0+0 ' +
  image.dst;

  exec(cmd, function(error, stdout, stderr) {
    if(error) {
      console.log(error);
    }
  });
}

And then call it:

然后调用它:

resize({
    src: sourceFile,
    dst: destinyFile,
    width: 320,
    height: 240
});

It will allow your custom parameters of quality, crop, watermark, etc...

它将允许您自定义质量、裁剪、水印等参数...

回答by Andy Lai

Try with Jimp package for Node.js https://www.npmjs.com/package/jimp. Which is better than gm I think. It does not require any dependencies. I tried to use gm before but I was not able to install dependencies for gm. End up I used jimp and everything worked fine.

尝试使用 Node.js https://www.npmjs.com/package/jimp 的Jimp 包。这比我认为的 gm 好。它不需要任何依赖项。我之前尝试过使用 gm 但我无法为 gm 安装依赖项。最后我使用了 jimp,一切正常。

   Jimp.read('lenna.png', (err, lenna) => {
      if (err) throw err;
      lenna
        .resize(256, 256) // resize
        .write('lena-small-bw.jpg'); // save
    });

回答by erichrusch

Two things...

两件事情...

1) https://github.com/rsms/node-imagemagick- This package is no longer supported I would recommend the original package you were using.

1) https://github.com/rsms/node-imagemagick- 不再支持此软件包我会推荐您使用的原始软件包。

2) The reason it's not resizing is that the .resize function takes in a string, not an integer. It should be... ('353', '257')

2)它不调整大小的原因是 .resize 函数接受一个字符串,而不是一个整数。应该是... ('353', '257')

gm('/path/to/image.jpg')
    .resize('353', '257')
    .write(writeStream, function (err) {
         if (!err) console.log(' hooray! ');
    });