2013-05-21 9 views
9

Quindi ci sono molti esempi su come scrivere un intero pixel da una vista Uint32Array dell'oggetto ImageData. Ma è possibile leggere un intero pixel senza incrementare il contatore 4 volte? Da hacks.mozilla.org, la scrittura di un pixel rgba si presenta come this.javascript ImageData ha digitato un intero pixel?

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); 

Ma, come posso leggere un intero pixel da un offset in una vista a 32 bit di ImageData single? Ecco cosa sto trovando confuso, non dovrebbe il buf32 di seguito avere una lunghezza di 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 ? 

grazie!

risposta

9

capito, ho bisogno di passare il buffer stesso nel costruttore Uint32Array, non un altro BufferView.

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

Grazie, questo è stato utile anche per me! – notJim

+0

È più veloce del loop su pixel –