nodejs 图片处理工具 gm 的使用！

环境要求

1. 安装 GraphicsMagick

下载地址：

http://www.graphicsmagick.org/

2. 安装 ImageMagic

下载地址：

https://imagemagick.org/index.php

3. 安装 gm

直接命令行安装： npm install --save gm

环境变量配置

GraphicsMagick 和 ImageMagic 安装完以后，需要把对应执行文件所在目录添加到环境变量，如下图所示。

实现切割逻辑

读取大图对应的数据文件（我这里用到的是 json 文件，其他格式的，可以根据实际格式修改对应逻辑），获取大图的，根据数据信息，读取对应位置和大小的图片，保存到本地即可，裁剪图片主要用下面的方法进行实现。

gm('png图片路径').crop(width, height, x, y).write(`碎图保存路径`, err => {if(err != null){console.log(err);}}
);

下图是实现时选择的大图对应 atlas 数据文件，格式化后的样式。

上图可以看出来，取出 frames 内的所有图片信息，就可以在大图内裁剪每张图片了，图片的名字同时也能获取得到。

具体实现代码如下：

var gm = require('gm');
var fs = require('fs');
const { createCipher } = require('crypto');var atlasname = '';
var pngname = '';
var filepath = '';process.stdout.write('please enter filename:\n');
process.stdin.on('data', e => {let str = e.toString();str = str.substring(0, str.indexOf('\r'));filepath = `./pic/${str}`;atlasname = `${filepath}.atlas`;pngname = `${filepath}.png`;fs.mkdirSync(filepath);let data = fs.readFileSync(atlasname);let json = JSON.parse(data.toString());for(var key in json.frames){console.log(`${key}`);var frame = json.frames[key].frame;gm(pngname).crop(frame.w, frame.h, frame.x, frame.y).write(`./${filepath}/${key}`, err => {if(err != null){console.log(err);}});}
});

上图是按照自己方便获取图片的格式进行的实现，可以根据自己的需要，进行逻辑修改即可，还可以添加批量处理。

上图是裁剪前的大图，下图是裁剪后成张的碎图。

扫码关注，获取更多分享！！

nodejs 图片处理工具 gm 的使用！相关推荐

nodejs gm 中文 linux,nodejs图片处理工具gm用法
在做H5应用中,有时候会涉及到一些图片加工处理的操作,nodejs有一个很好的后台图片处理module,就是这里说的gm.gm有官方文档,但感觉写得太抽象,反而看不懂了.这里把一些常见的用法写下,供大 ...
nodejs图片处理工具gm用法
在做H5应用中,有时候会涉及到一些图片加工处理的操作,nodejs有一个很好的后台图片处理module,就是这里说的gm.gm有官方文档,但感觉写得太抽象,反而看不懂了.这里把一些常见的用法写下,供大 ...
【linux】记录nodejs使用图片处理工具gm
前言 nodejs项目需要生成缩略图,由于node本身无法处理,需要用到GraphicsMagick工具,于是开始网上找工具,中间踩了一些坑,于是记录下来. 安装GraphicsMagick 安装这个 ...
node_demo_03 一个好玩的图片处理工具gm模块小练习。
/* *修改图片大小 */ //需引用第三方模块,在工作目录下执行npm install gm即可 //通过require引用,Subclass gm to enable ImageMagick va ...
nodejs图片总结
nodejs图片总结今天终于把朴灵老师写的<深入浅出Node.js>给学习完了, 这本书不是一本简单的Node入门书籍,它没有停留在Node介绍或者框架.库的使用层面上,而是从不同的视角 ...
强大的图片处理工具GraphicsMagick
前言项目中我们经常需要对图片进行压缩.剪切.添加水印.生成缩略图.图片合成等图片处理操作,关于这些图片复杂处理,我们将如何实现呢,本文将介绍GraphicsMagick对图片进行相关处理功能. 简介 ...
CV之LabelImg：图片标注工具之LabelImg(图像标注工具)的简介、安装、使用方法详细攻略
CV之LabelImg:图片标注工具之LabelImg(图像标注工具)的简介.安装.使用方法详细攻略目录 LabelImg的简介常见的图片标注工具 LabelImg trainingImageLa ...
ImageView可直接调用的，根据URL设置图片的工具类
ImageView 是Android编程中最常用的组件之一. 但是根据图片的URL设置图片却很麻烦.因为获取网络图片的操作必须在异步线程中进行,根据URL设置ImageView图片就可能需要进行线程间 ...
VOC数据集图片标注工具labelImg简介、安装、使用方法详细攻略（windows） PyQt4、PyQt5
参考文章1:labelImg:图片标注工具之labelImg的简介.安装.使用方法详细攻略参考文章2:LabelImg labelImg的安装用gitbash打开,运行git clone http ...

nodejs 图片处理工具 gm 的使用！

nodejs 图片处理工具 gm 的使用！相关推荐

最新文章

热门文章