小程序獲取 canvas 區(qū)域隱含的像素數(shù)據(jù)wx.canvasGetImageData

wx.canvasGetImageData(Object object, Object this)
獲取 canvas 區(qū)域隱含的像素數(shù)據(jù)。

參數(shù)
Object object
屬性    類型    默認值    必填    說明
canvasId    string        是    畫布標識，傳入 canvas 組件的 canvas-id 屬性。
x    number        是    將要被提取的圖像數(shù)據(jù)矩形區(qū)域的左上角橫坐標
y    number        是    將要被提取的圖像數(shù)據(jù)矩形區(qū)域的左上角縱坐標
width    number        是    將要被提取的圖像數(shù)據(jù)矩形區(qū)域的寬度
height    number        是    將要被提取的圖像數(shù)據(jù)矩形區(qū)域的高度
success    function        否    接口調(diào)用成功的回調(diào)函數(shù)
fail    function        否    接口調(diào)用失敗的回調(diào)函數(shù)
complete    function        否    接口調(diào)用結(jié)束的回調(diào)函數(shù)（調(diào)用成功、失敗都會執(zhí)行）
object.success 回調(diào)函數(shù)
參數(shù)
Object res
屬性    類型    說明
width    number    圖像數(shù)據(jù)矩形的寬度
height    number    圖像數(shù)據(jù)矩形的高度
data    Uint8ClampedArray    圖像像素點數(shù)據(jù)，一維數(shù)組，每四項表示一個像素點的 rgba
Object this
在自定義組件下，當前組件實例的this，以操作組件內(nèi) canvas 組件

示例代碼

wx.canvasGetImageData({
  canvasId: 'myCanvas',
  x: 0,
  y: 0,
  width: 100,
  height: 100,
  success(res) {
    console.log(res.width) // 100
    console.log(res.height) // 100
    console.log(res.data instanceof Uint8ClampedArray) // true
    console.log(res.data.length) // 100 * 100 * 4
  }
})