将 GIF 的所有帧显示为单个图像

Posted 2023-03-25

【中文标题】将 GIF 的所有帧显示为单个图像

【英文标题】：Display all frames of a GIF as a single image

【发布时间】：2020-10-18 00:07:16

【问题描述】：

我正在使用 gif-frames (https://www.npmjs.com/package/gif-frames) 从动画 GIFS 中提取帧。我想将所有帧保存为单个图像。

我知道我可以使用https://www.npmjs.com/package/merge-img 之类的东西，但我不知道如何使用 gif 帧的 frameData 输出并将其用作 mergeImg 的输入。 你能帮忙吗？

【问题讨论】：

您可以通过 ImageMagick 在终端中使用magick INPUT.GIF -coalesce +append result.png 轻松完成。如果使用较旧的 v6，请将 magick 替换为 convert。

【参考方案1】：

我发现最简单的方法如下，但我相信还有更好的方法。

gifFrames(

   url: 'img.gif', frames: '0-2', outputType: 'jpg', cumulative: true ,
  function (err, frameData) 
    if (err) 
      throw err;
    

    frameData.forEach(function (frame) 
      frame.getImage().pipe(fs.createWriteStream(
        'image-' + frame.frameIndex + '.png'
      ));
      all_imgs.push('image-' + frame.frameIndex + '.png');
    );
    mergeImg(all_imgs).then((img) => 
      // Save image as file
      img.write('out.png', () => console.log('done'));
    );
  
);