12

したがって、ImageData オブジェクトの Uint32Array ビューからピクセル全体を書き込む方法については、多くの例があります。しかし、カウンターを 4 回インクリメントせずにピクセル全体を読み取ることは可能ですか? hacks.mozilla.orgから、rgba ピクセルを書くと次のようになります。

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 ?

ありがとう！

4

2 に答える 2

15

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

var buf32 = new Uint32Array(imgd.data.buffer);
console.log(buf32.length)  // 64 yay!
于 2013-05-21T21:03:50.523 に答える