npm 包 gm-binary 使用教程-JavaScript中文网-JavaScript教程资源分享门户

前言

在前端开发中，我们经常需要对图片进行处理，例如裁剪和缩放。这时候就需要使用到一些图片处理工具。一个比较流行的 Node.js 图片处理工具是 gm。

gm 是一个基于 ImageMagick 和 GraphicsMagick 的 Node.js 图片处理库，它可以处理图像的转换、操作和合成等。而 gm-binary 则是一个 gm 的二进制可执行文件，可以简化 gm 的安装流程。本文主要介绍如何使用 gm-binary 来进行图片处理。

在使用 gm-binary 之前，需要先安装 GraphicsMagick 或 ImageMagick。而其中 GraphicsMagick 是推荐的选择。

对于 Mac 用户，可以使用 Homebrew 来安装 GraphicsMagick：

brew install graphicsmagick

对于 Ubuntu 用户，可以使用 apt-get 命令来安装 GraphicsMagick：

sudo apt-get install graphicsmagick

对于 Windows 用户，可以在 ImageMagick 官网上下载安装包进行安装：https://imagemagick.org/script/download.php#windows

对于 Mac 和 Ubuntu 用户，可以使用 apt-get 命令来安装 ImageMagick：

sudo apt-get install imagemagick

安装 gm-binary 非常简单，只需要运行以下命令即可：

npm install gm-binary

如果不想全局安装，也可以在项目中安装：

npm install gm-binary --save

安装完成后，可以使用以下方式引入 gm-binary：

const gm = require('gm-binary');

gm-binary 提供了丰富的图片处理功能，以下是一些常用功能的使用方法。

裁剪图片可以使用 crop 方法，该方法有四个参数：宽度、高度、起始横坐标、起始纵坐标。

gm('input.jpg').crop(300, 300, 100, 100).write('output.jpg', function (err) {
  if (!err) console.log('done');
});

缩放图片可以使用 resize 方法，该方法有两个参数：宽度和高度。

gm('input.jpg').resize(200, 200).write('output.jpg', function (err) {
  if (!err) console.log('done');
});

图片旋转可以使用 rotate 方法，该方法有一个参数：角度。

gm('input.jpg').rotate('white', 45).write('output.jpg', function (err) {
  if (!err) console.log('done');
});

图片水印可以使用 drawText 方法，该方法有三个参数：文字内容、起始横坐标和起始纵坐标。

gm('input.jpg').drawText(50, 50, 'WATERMARK').write('output.jpg', function (err) {
  if (!err) console.log('done');
});

图片合成可以使用 composite 方法，该方法有三个参数：叠加图片的路径、起始横坐标和起始纵坐标。

gm('input.jpg')
  .composite('overlay.png', 100, 100)
  .write('output.jpg', function (err) {
    if (!err) console.log('done');
  });

本文介绍了如何安装和使用 gm-binary 来进行图片处理。通过本文的学习，你可以在前端开发中更方便地进行图片处理。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/60066e72255dee6beeee74d0