nodejs操作画像

ディレクトリ

関連ソフトウェアのインストール

通常の操作

ロード画像

設定サイズ

等比スケーリング

固定スケーリング

条件スケーリング

画像に文字を追加する

中国語を追加します.

ピクチャ重畳

文字に円角背景を追加する

出力

結語

目次
ソフトウェアのインストール
まず、imagmagickとgraphic smagicをインストールします.私はmacを使っていますので、homebrewを使います.

brew install imagemagick
brew install graphicsmagick
brew install ghostscript

npmパッケージの取り付け

npm i gm --save

通常の操作
画像を読み込み

//graphMagick
const gm = require('gm');
//imageMagick
const gm = require('gm').subClass({imageMagick: true});

サイズを設定
等比ズーム

var imgObj = gm(imagePath).resize(width, height);

固定ズーム

let width = 100, height = 100;
var imgObj = gm(imagePath).resize(width, height, "!");

"!"の感嘆符は、元のピクチャの比率にかかわらず、スケーリングされたピクチャのサイズがwidth × heightであるため、画像の変形を引き起こす可能性がある.
条件付きスケーリング

var imgObj = gm(imagePath).resize(width, height, ");

">"または" ， ， 。 。を通じて

var imgObj = gm(imagePath).resize(width, height, ");

画像にテキストを追加
中国語を追加
中国語のフォントを追加するには、まずフォントを読み込む必要があります.ImageMagickの中国語フォントが見つからないので、ここではOSXの標準フォントをそのまま使います.

const font = "/Library/Fonts/    .ttf";
let x = 0, y = 0, color = "white";
var imgObj = gm(imagePath).fill(color).font(font,120).drawText(x, y, "    ")

gravityに合わせて置くこともできます.

let x = 100, y = 0, color = "white";
var imgObj = gm(imagePath).fill(color).font(font,120).drawText(x, y, "    ", "North");

gravityは東南の西北を支持して、東南、西南、東北、西北がまだあります.このときのオフセット量は、基本的な位置決め後にシフトします.
画像重ね合わせ
写真の上に顔写真を載せて、右下にこのように処理できます.

var imgObj = gm(imagePath).composite(headimgPath).gravity("SouthEast").geometry(`+50+50`)

角の背景をテキストに追加します.
考えは文字の長さとフォントの大きさによって背景の大きさを計算してから、文字を上に置くことです.

const font = "/Library/Fonts/    .ttf";
let text = "  ";
let width = text.length * fontSize + fontSize,
    height = fontSize + fontSize,
    margin = fontSize / 2,
    fontSize = 18;
let imgObj = gm(width, height, "none")
    .fill("#FAFAFA").drawRectangle(0, 0 , width , height, margin, margin)
    .fill("black").font(font, fontSize).drawText(margin, margin / 2 + fontSize, text);

出力
三つの出力があります.ファイルを保存し、バイナリストリームを出力し、ブザーを出力します.

const co = require('co');
const thunkify = require('thunkify');
co(function*(){
    // imgObj                 
    let buffer = yield thunkify(imgObj.toBuffer).call(imgObj, "PNG");
    yield thunkify(imgObj.write).call(imgObj, filePath);
})

おわりに
具体的な提案はやはり文書を主とします.

gm包文書住所:https://www.npmjs.com/package/gm

nodejsインターフェースアドレス:http://aheckmann.github.io/gm/docs.html#manipulation

今後機会があれば他の操作も加えます.