溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
在做H5應用中，有時候會涉及到一些圖片加工處理的操作，nodejs有一個很好的后臺圖片處理module，就是這里說的gm。gm有官方文檔，但感覺寫得太抽象，反而看不懂了。這里把一些常見的用法寫下，供大家參考。
安裝
首先要安裝 GraphicsMagick或者ImageMagick，然后
npm install --save gm
GraphicsMagick和ImageMagick的區別
GraphicsMagick是從ImageMagick中分離出來的，推薦下載ImageMagick
加載GraphicsMagick(大小4.72 MB)
var gm = require('gm')
加載ImageMagick(大小23.8 MB)
var gm = require('gm').subClass({imageMagick: true})// 注意使用的區別
除了加載有區別，其他使用方式完全一樣
用法說明
圖片尺寸
gm('img.png')
.size(function (err, size) {
if (!err)
console.log(size.width > size.height ? 'wider' : 'taller than you');
});
圖片伸縮
可以只依據寬、高或者同時將寬高都放縮。
gm("img.png").resize(width)//保持寬高比
gm("img.png").resize(null, height)//保持寬高比
gm("img.png").resize(width, height, '!')//參數'!'用于忽略寬高比
圖片旋轉
將圖片旋轉degrees，背景填充color。
gm("img.png").rotate(color, degrees)
gm("img.png").rotate('green', 45)
圖片裁剪
從圖片的(x, y)位置開始，裁剪出一個寬為width，高為height的圖片來。
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)有什么區別，gm提供了兩條命令，對于簡單的圖片合成，好像都可以使用。
圖片拼接(append)
gm中使用append也可以實現圖片的拼接，與mosaic、compose不同的是，這里的拼接應該是不能覆蓋的。缺省參數ltr表示拼接方向，布爾變量，true表示從左到右，false表示從上到下，默認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")
創建圖片
gm(200, 400, "#ddff99f3")
.drawText(10, 50, "from scratch")
.write("/path/to/brandNewImg.jpg", function (err) {
// ...
});
總結
gm具有強大的圖片處理功能，nodejs還是借助于gm工具來實現的圖片處理，對于需要后臺處理圖片的情形，這個是挺有用的。
gm提供的各個函數其實可以復合使用，就是說，先讀取(gm)圖片后，可以先進行拼接(mosaic, compose, append)，然后裁剪(crop)，放縮(resize)到指定大小后，最后才保存(write)下來。
gm的官方文檔感覺過于簡陋，網上的關于nodejs gm用法的資料也不多，本文將一些基本的用法總結下來，學到到新的持續更新。
另外，歡迎大家總結nodejs gm資料！
附gm參考資料
node gm github
nodejs gm官方文檔
stackoverflow : How to do composite with gm node.js?
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持億速云。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
