近期證書生成的活動比較流行叨吮，如馬拉松證書生成活動辆布，運營同學打算做一個大學錄取通知書的活動。以前相關的活動都在nodejs服務器上進行開發(fā)茶鉴，這次也就不例外了锋玲。
nodejs的圖片處理庫不少，使用比較多的有以下幾個：
- node-images：在cnode上有node-iamges作者寫的文章涵叮。這個庫安裝簡單惭蹂，依賴少伞插；借助它可以實現(xiàn)改變圖片大小、圖片合并等功能盾碗。本打算使用它進行開發(fā)媚污，但是由于其不支持文字寫入，只好另尋他路了廷雅。
- node canvas：這個庫我調(diào)研的較少耗美，百度上有不少文章，大家可以自行查看進行判斷榜轿，其中此文介紹了其在百度地圖上的使用幽歼，說明其功能還是很強大的。
- gm: gm是nodejs對GraphicsMagick和ImageMagick封裝谬盐。GraphicsMagick和ImageMagick是老牌的圖片處理工具甸私，它們功能很強大，包括了圖片的創(chuàng)建飞傀、編輯皇型、合成、讀取砸烦、轉換弃鸦、切割、顏色替換等各種圖片處理功能幢痘。 gm基于它倆進行開發(fā)唬格，可知gm的功能強大。功能的強大就可能意味著安裝和使用的復雜颜说！本文主要介紹gm的安裝和使用方法购岗；同時對經(jīng)常遇到的中文亂碼問題進行了介紹。由于開發(fā)機器是mac门粪，所以只覆蓋到了mac和linux系統(tǒng)喊积。
安裝gm
gm在mac上的安裝比較簡單，依據(jù)npm上的介紹進行即可：
brew install imagemagick
brew install graphicsmagick
在linux上安裝gm玄妈，我參考了GraphicsMagick介紹及安裝乾吻，，服務器是阿里云拟蜻，主要步驟如下：
- 獲取安裝包
wget http://iweb.dl.sourceforge.net/project/graphicsmagick/graphicsmagick/1.3.23/GraphicsMagick-1.3.23.tar.gz
- 解壓然后執(zhí)行configure和make make install
tar -zvf GraphicsMagick-1.3.23.tar.gz
cd GraphicsMagick-1.3.23/
./configure
make
make install
- 執(zhí)行：
convert -v, 看到如下內(nèi)容绎签，就說明安裝成功了：
在工程目錄執(zhí)行： npm install gm
安裝完成后，在nodejs中使用gm：
var fs = require('fs');
var gm = require('gm');
gm('./resources/dev/images/help/1_big.jpg')
.draw('image Over 100, 100 100, 100 "./resources/dev/images/app/actGuide.png"')
.write('./resources/dev/images/app/aboutus_modify.jpg', function(err) {
if (!err){ console.log('done');
}else{console.log(err.message || "出錯了酝锅！"); } });
執(zhí)行后辜御，可以看到aboutus_modify.jpg是1_big.jpg和actGuide.png的合成。
需要特別注意gm中函數(shù)參數(shù)的寫法屈张，其函數(shù)說明文檔地址是：draw函數(shù)說明擒权，對比上述例子中寫法袱巨，希望大家多加注意。
另外：gm的APi文檔地址是：gm API文檔 碳抄，可以結合GraphicsMagick的文檔使用愉老。
中文亂碼
gm正常跑起來后，經(jīng)常會遇到中文亂碼問題剖效。在以往GraphicsMagick的使用中嫉入，已經(jīng)有不少關于這方面的總結：
- how to use imagick annotateImage for chinese text? --php
- GM中文亂碼如何解決？ -- node
- GraphicsMagick中文亂碼解決辦法 -- java
- 如何用imagemagick在圖片上寫中文 -- cmd
- 用ImageMagick在圖片中寫中文的問題及解決 --cmd
上述文章中作者都對中文亂碼問題提出了自己的解決方法璧尸，在GraphicsMagick的文檔和社區(qū)中也有對這類問題的解答:
總結起來解決亂碼需滿足兩個條件：1. 文檔utf-8編碼咒林； 2. 指定中文字體庫。
結合Demo程序進行說明：
var gm = require('gm');
var _name = "China中文";
gm('./resources/dev/images/help/1_big.jpg')
.draw('image Over 100, 100 100, 100 "./resources/dev/images/app/actGuide.png"')
.font('/Library/Fonts/微軟雅黑.ttf')
// .font('/usr/share/fonts/微軟雅黑.ttf') /* 服務器上的路徑*/
.draw('text 100, 100 '+_name)
// .resize(240, 240)
.write('./resources/dev/images/app/aboutus_modify.jpg', function(err) {
if (!err){
console.log('done');
}else{
console.log(err.message || "出錯了爷光！");
}
});
上面程序得到的結果如下垫竞，可以看到中文能正常顯示，而且字體也是我們指定的微軟雅黑：
我們來分析下解決亂碼的兩個條件：
文檔utf-8編碼：這里utf-8編碼是指要求文件的存儲編碼方式是utf-8蛀序，而不是對字符進行utf-8編碼（如js中的encodeURI）欢瞪。通過對IDE或者其他方式確定文件的編碼方式，如有問題可自行百度徐裸。
指定中文字體庫：可以通過
.font('/Library/Fonts/微軟雅黑.ttf') //mac系統(tǒng)下或.font('/usr/share/fonts/微軟雅黑.ttf') //linux系統(tǒng)下指定遣鼓。 font函數(shù)的參數(shù)是字體在系統(tǒng)中的存儲路徑。
Mac電腦的字體存儲文件路徑是：/Library/Fonts/重贺，如下圖所示：
linux下骑祟， fc-list: 查詢所有安裝字體，fc-list :lang=zh:查詢安裝的中文字體气笙， 字體的安裝路徑是：/usr/share/fonts次企。
如果需要安裝特定字體，可以到這個網(wǎng)站上下載健民，然后依據(jù)不同平臺進行安裝：
- Windows 7 / Vista - 選定文件點擊右鍵選安裝
- Windows XP - 復制和粘貼字體文件到C:\WINDOWS\FONTS
- Mac OS X - 雙擊字體文件然后選擇安裝字體
- Linux - 復制字體文件到/USR/SHARE/FONTS
總結
文章簡要介紹了gm模塊的使用以及可能遇到的中文亂碼問題，希望對大家有多幫助贫贝。
