首先,確保你本地已經安裝好了node環境。
而後,咱們進行圖像編輯操做須要用到一個Node.js的庫:images。
這個庫的地址是:https://github.com/zhangyuanwei/node-images,做者定義它爲 「Node.js輕量級跨平臺圖像編解碼庫」 ,並提供了一系列接口。
咱們要作的首先是安裝images庫:node
npm install imagesgit
step2:JS代碼github
var images = require('images'); var path = require('path'); var watermarkImg = images('water_logo.png'); var sourceImg = images('source.png'); // 好比放置在右下角,先獲取原圖的尺寸和水印圖片尺寸 var sWidth = sourceImg.width(); var sHeight = sourceImg.height(); var wmWidth = watermarkImg.width(); var wmHeight = watermarkImg.height(); images(sourceImg) // 設置繪製的座標位置,右下角距離 40px .draw(watermarkImg, sWidth - wmWidth - 40, sHeight - wmHeight - 40) // 保存格式會自動識別 .save('saveimg.png');
step3:運行node app命令npm
step4:運行node命令後,文件夾結構以下圖app
step5:最終生成的加水印圖片ui