javascript ImageData型付き配列全体のピクセルを読み取りますか？

Question

したがって、多くの例があります。 ImageDataオブジェクトのUint32Arrayビューからピクセル全体を書き込みます。しかし、カウンターを4回インクリメントせずにピクセル全体を読み取ることは可能ですか？ hacks.mozilla.orgから、rgbaピクセルの書き込みは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); 

しかし、ImageDataの32ビットビューで1つのオフセットからピクセル全体を読み取るにはどうすればよいですか？私が混乱しているのは何ですか？buf32の長さが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 ? 

ありがとうございました！

Answer 1

私はUint32Arrayコンストラクタに別のBufferViewではなく、バッファそのものを渡す必要があります。

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