Resize and crop image and keeping aspect ratio NodeJS & gm

梦想与她 提交于 2019-12-04 07:46:17

问题


I've been trying to create some thumbnails using the gm package 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.

For example, given this code, I assume that running node app /path/to/image.png I'll receive an image with size of 200x100, but instead I got, say, an image of 180x100 or 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! ');
    });

回答1:


Try with imagemagick package for NodeJS: 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-imagemagick package hasn't been updated in quite a long time. Please consider Freyday's answer since it's most up-to-date.




回答2:


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

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 resize function will tell GraphicsMagick to use the height and width as a minimum instead of the default behavior, maximum. The resulting resized image will have either the width or height be your designated dimension, while the non-conforming dimension is larger than the specified size.

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

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




回答3:


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

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...




回答4:


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.

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



回答5:


Two things...

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

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

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


来源:https://stackoverflow.com/questions/21591536/resize-and-crop-image-and-keeping-aspect-ratio-nodejs-gm

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!