nodejs讀取圖片像素

之前在做H5時，有這麼一個關於圖片的問題，就是把一張圖片裁剪得左右空白部分對稱，圖片背景爲白色。這件事情說來也簡單，讀取圖片的像素，分別檢測左右空白部分的寬度，然後裁剪到一樣即可 。

接下來就涉及到讀取圖片像素的問題了，發現了一個好用的工具get-pixels，可以讀取圖片像素並返回數組。

安裝

npm install --save get-pixels

目前支持PNG, JPEG和GIF三種格式的圖片。

用法

var getPixels = require("get-pixels")

getPixels("lena.png", function(err, pixels) {
  if(err) {
    console.log("Bad image path")
    return
  }
  console.log(pixels)
})

如上是讀取數據的過程，返回值pixels是一個ndarray對象。如下是一個JPG圖片的輸出示例：

{ data: <Buffer ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ff ... >,
  shape: [ 560, 508, 4 ],
  stride: [ 4, 2240, 1 ],
  offset: 0 }

其中data是一維數組，描述顏色的RGBA值，shape表示數組維度和各個維度的大小， 該圖片長寬分別爲560和508，第三個維度表示RGBA值。stride是數組各個維度的步長，offset表示起始值。
可以通過下面的函數遍歷ndarray：

getPixels("lena.png", function(err, pixels) {
  if(!err) {
      console.log(pixels.get(0,0,0));//讀取位置(0,0)處的R值。
  }  
})

值得注意的是，對於JPG和PNG圖片，返回的是三維數組[width, height, channels]。但對於GIF，則是一個四維數組[numFrames, width, height, 4]。

這樣，就可以採集圖片的像素進行處理，配合gm工具，可以對圖片進行一些操作了。