快捷導(dǎo)航

nodejs圖片處理工具gm用法小結(jié)

更新時(shí)間：2018年12月12日 11:41:46 作者：無(wú)名大盜

這篇文章主要介紹了nodejs圖片處理工具gm用法小結(jié)，詳細(xì)的介紹了gm的使用，還有圖片處理的實(shí)例，非常具有實(shí)用價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧

在做H5應(yīng)用中，有時(shí)候會(huì)涉及到一些圖片加工處理的操作，nodejs有一個(gè)很好的后臺(tái)圖片處理module，就是這里說(shuō)的gm。gm有官方文檔，但感覺(jué)寫(xiě)得太抽象，反而看不懂了。這里把一些常見(jiàn)的用法寫(xiě)下，供大家參考。

安裝

首先要安裝 GraphicsMagick或者ImageMagick，然后

npm install --save gm

GraphicsMagick和ImageMagick的區(qū)別

GraphicsMagick是從ImageMagick中分離出來(lái)的，推薦下載ImageMagick

加載GraphicsMagick(大小4.72 MB)

var gm = require('gm')

加載ImageMagick(大小23.8 MB)

var gm = require('gm').subClass({imageMagick: true})// 注意使用的區(qū)別

除了加載有區(qū)別，其他使用方式完全一樣

用法說(shuō)明

圖片尺寸

gm('img.png')
.size(function (err, size) {
 if (!err)
  console.log(size.width > size.height ? 'wider' : 'taller than you');
});

圖片伸縮

可以只依據(jù)寬、高或者同時(shí)將寬高都放縮。

gm("img.png").resize(width)//保持寬高比
gm("img.png").resize(null, height)//保持寬高比
gm("img.png").resize(width, height, '!')//參數(shù)'!'用于忽略寬高比

圖片旋轉(zhuǎn)

將圖片旋轉(zhuǎn)degrees，背景填充color。

gm("img.png").rotate(color, degrees)
gm("img.png").rotate('green', 45)

圖片裁剪

從圖片的(x, y)位置開(kāi)始，裁剪出一個(gè)寬為width，高為height的圖片來(lái)。

gm("img.png").crop(width, height, x, y)

圖片拼接(mosaic)

gm()
 .in('-page', '+0+0')
 .in('bg.jpg')
 .in('-page', '+10+20') // location of smallIcon.jpg is x,y -> 10, 20
 .in('smallIcon.jpg')
 .mosaic()
 .write('tesOutput.jpg', function (err) {
  if (err) console.log(err);
 });

圖片合成(compose)

gm()
.command("composite") 
.in("-gravity", "center")
.in(change_image_url)
.in(base_image_url)
.write( output_file, function (err) {
 if (!err) 
  console.log(' hooray! ');
 else
  console.log(err);
});

不太清楚圖片拼接(mosaic)與合成(compose)有什么區(qū)別，gm提供了兩條命令，對(duì)于簡(jiǎn)單的圖片合成，好像都可以使用。

圖片拼接(append)

gm中使用append也可以實(shí)現(xiàn)圖片的拼接，與mosaic、compose不同的是，這里的拼接應(yīng)該是不能覆蓋的。缺省參數(shù)ltr表示拼接方向，布爾變量，true表示從左到右，false表示從上到下，默認(rèn)false。

gm("img.png").append(img [, img, ltr])
gm("img.png").append("another.jpg", "third.gif")//從上到下拼接
gm("img.png").append("another.jpg", "third.gif", true)//從左到右拼接

圖片注釋

在圖片的(x, y)位置繪制文字。

gm("img.png").drawText(10, 50, "from scratch")

創(chuàng)建圖片

gm(200, 400, "#ddff99f3")
.drawText(10, 50, "from scratch")
.write("/path/to/brandNewImg.jpg", function (err) {
 // ...
});

總結(jié)

gm具有強(qiáng)大的圖片處理功能，nodejs還是借助于gm工具來(lái)實(shí)現(xiàn)的圖片處理，對(duì)于需要后臺(tái)處理圖片的情形，這個(gè)是挺有用的。

gm提供的各個(gè)函數(shù)其實(shí)可以復(fù)合使用，就是說(shuō)，先讀取(gm)圖片后，可以先進(jìn)行拼接(mosaic, compose, append)，然后裁剪(crop)，放縮(resize)到指定大小后，最后才保存(write)下來(lái)。

gm的官方文檔感覺(jué)過(guò)于簡(jiǎn)陋，網(wǎng)上的關(guān)于nodejs gm用法的資料也不多，本文將一些基本的用法總結(jié)下來(lái)，學(xué)到到新的持續(xù)更新。

另外，歡迎大家總結(jié)nodejs gm資料！

附gm參考資料

node gm github

nodejs gm官方文檔

stackoverflow : How to do composite with gm node.js?

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

最新国产好看的视频,伊人天堂AV在线,国产Aaaaaa视频,蜜臀视频在线观看一区,人妻av色图,密臀久久久精品影片,青青视频免费观看毛片,久草在线观看视,国产三级精品色情在线

nodejs圖片處理工具gm用法小結(jié)

相關(guān)文章

最新評(píng)論

大家感興趣的內(nèi)容

最近更新的內(nèi)容

常用在線小工具