在做H5应用中,有时候会涉及到一些图片加工处理的操作,nodejs有一个很好的后台图片处理模块,就是这里说的gm.gm有官方文档,但感觉写得太抽象,反而看不懂了。这里把一些常见的用法写下,供大家参考。
首先要安装GraphicsMagick或者ImageMagick,然后
npm安装——拯救通用汽车
<强> GraphicsMagick和ImageMagick的区别
GraphicsMagick是从ImageMagick中分离出来的,推荐下载ImageMagick
加载GraphicsMagick(大小4.72 MB)
var通用=要求(“通用汽车”)
加载ImageMagick(大小23.8 MB)
通用var=需要(“通用汽车”)。子类({imageMagick:真})//注意使用的区别
除了加载有区别,其他使用方式完全一样
<强>图片尺寸
通用汽车(“img.png”)
.size(函数(呃,大小){
如果(!呃)
console.log(大小。宽度比;大小。高度& # 63;“大”:“比你高”);
});
之前
<强>图片伸缩
可以只依据宽,高或者同时将宽高都放缩。
通用(img.png) .resize(宽度)//保持宽高比
通用汽车(“img.png”)。调整(null,高度)//保持宽高比
通用汽车(“img.png”)。调整大小(宽度、高度,“!”)//参数“!”用于忽略宽高比
之前
<强>图片旋转
将图片旋转度,背景填充颜色。
通用汽车(“img.png”)。旋转(颜色、度)
通用汽车(“img.png”)。旋转(“绿色”,45岁)
<强>图片裁剪
从图片的(x, y)位置开始,裁剪出一个宽为宽度,高为高度的图片来。
通用汽车(“img.png”)。作物(宽度、高度,x, y)
<强>图片拼接(马赛克)
通用()
在(“页面”,“+ 0 + 0”)
在(“bg.jpg”)
在(“页面”,+ 10 + 20)//位置smallIcon.jpg是x, y→10年,20年
在(“smallIcon.jpg”)
.mosaic ()
.write (tesOutput.jpg,函数(err) {
如果(err) console.log(错);
});
之前
<强>图片合成(组合)
通用()
.command(“复合”)
在(“重力”,“中心”)
在(change_image_url)
在(base_image_url)
.write (output_file、功能(err) {
如果(!呃)
控制台。日志(“万岁!”);
其他的
console.log(错);
});
不太清楚图片拼接(马赛克)与合成(组合)有什么区别,通用汽车提供了两条命令,对于简单的图片合成,好像都可以使用。
<强>图片拼接(附加)
通用中使用附加也可以实现图片的拼接,与马赛克,组成不同的是,这里的拼接应该是不能覆盖的。缺省参数ltr表示拼接方向,布尔变量,真表示从左到右,假表示从上到下,默认假。
通用汽车(“img.png”)。追加(img [img, ltr])
通用汽车(“img.png”) .append (“another.jpg”、“third.gif”)//从上到下拼接
通用汽车(“img.png”) .append (“another.jpg”、“第三。gif”,真正的)//从左到右拼接
<强>图片注释
在图片的(x, y)位置绘制文字。
通用汽车(“img.png”)。drawText(10, 50岁,“从头开始”)
<>强创建图片
通用汽车(200年,400年,“# ddff99f3”)
.drawText(10, 50岁,“从头开始”)
.write(“/道路//brandNewImg.jpg”功能(err) {//?
});
通用具有强大的图片处理功能,nodejs还是借助于通用汽车工具来实现的图片处理,对于需要后台处理图片的情形,这个是挺有用的。
通用提供的各个函数其实可以复合使用,就是说,先读取(gm)图片后,可以先进行拼接(马赛克,构成,附加),然后裁剪(作物)、放缩(调整)到指定大小后,最后才保存(写)下来。
