javascript ImageData đã nhập mảng đọc toàn bộ pixel?

Question

Vì vậy, có rất nhiều ví dụ về cách viết toàn bộ pixel từ chế độ xem Uint32Array của đối tượng ImageData. Nhưng có thể đọc toàn bộ điểm ảnh mà không tăng bộ đếm 4 lần không? Từ hacks.mozilla.org, viết một pixel rgba trông giống như this.

var imageData = ctx.getImageData(0, 0, canvasWidth, canvasHeight); 

var buf = new ArrayBuffer(imageData.data.length); 
var buf8 = new Uint8ClampedArray(buf); 
var data = new Uint32Array(buf); 

for (var y = 0; y < canvasHeight; ++y) { 
    for (var x = 0; x < canvasWidth; ++x) { 
     var value = x * y & 0xff; 

     data[y * canvasWidth + x] = 
      (255 << 24) | // alpha 
      (value << 16) | // blue 
      (value << 8) | // green 
      value;   // red 
    } 
} 

imageData.data.set(buf8); 

ctx.putImageData(imageData, 0, 0); 

Nhưng, làm cách nào tôi có thể đọc toàn bộ pixel từ một lần bù trong chế độ xem 32 bit của ImageData? Đây là những gì tôi thấy khó hiểu, không nên buf32 dưới đây có chiều dài 256/4 = 64?

// 8x8 image 
var imgd = ctx.getImageData(0, 0, canvasWidth, canvasHeight), 
    buf32 = new Uint32Array(imgd.data); 

console.log(imgd.data.length); // 256 
console.log(buf32.length);  // 256 shouldn't this be 256/4 ? 

cảm ơn!

Answer 1

figured it out, tôi cần phải vượt qua bộ đệm chính nó vào constructor Uint32Array, không phải là một BufferView.

var buf32 = new Uint32Array(imgd.data.buffer); 
console.log(buf32.length) // 64 yay!