使用 Imagemagick 的 Node-gm 圆形图像裁剪

Question

我一直在尝试使用 node-gm + Imagemagick 来循环裁剪图像。

无论如何，这是我使用黑色圆圈创建蒙版的尝试。

var original = 'app-server/photo.jpg'; 
var output = 'app-server/photo.png';
var maskPath = 'app-server/photo-mask.png';

gm(original)
     .crop(233, 233,29,26)
     .resize(80, 80)
     .setFormat('png')
     .write(output, function (err) {
        console.log(err || 'cropped to target size');

        gm(output)
           .out('-size', '80x80')
           .background('black')
           .drawCircle(20,20, 0, 0)
           .toBuffer('PNG',function (err, buffer) {

              console.log(err || 'created circular black mask');

              //docs say "a buffer can be passed instead of 
              //a filepath" but this is apparently false
              //and say something unclear about using black/white colors for masking.
              //I'm clearly lost
              gm(output)
                 .mask(maskPath)
                 .write(output,  function (err) {
                    console.log(err || 'applied circular black mask to image');
                 });
           });

     });

我确信这可以通过一些花哨的字符串命令连接来完成，但是尽管我缺乏图像处理能力，但我仍然希望保持代码干净。我真的在寻找使用 node-gm 函数的解决方案，最好是操作比我的尝试少（也最好是可行的东西，不像我的那样）。

我还尝试链接此命令的函数调用，但没有成功： https://stackoverflow.com/a/999563/1267778

请注意，我需要在特定位置（w、h、x、y）进行裁剪，因此这些解决方案也不适用于我：

node-pngjs

node-circle-image

Answer 1

知道了！经过几个小时的摆弄，我得到了我需要的东西。

gm(originalFilePath)
  .crop(233, 233,29,26)
  .resize(size, size)
  .write(outputFilePath, function(err) {
     gm(size, size, 'none')
        .fill(outputFilePath)
        .drawCircle(size/2,size/2, size/2, 0)
        .write(output, function(err) {
           console.log(err || 'done');
        });
  });

我使用JCrop 允许用户在前端裁剪图像并将坐标（w、h、x、y）传递给crop()。