gpt4 book ai didi

canvas - javascript ImageData 类型化数组读取整个像素?

转载 作者:行者123 更新时间:2023-12-04 02:07:50 27 4
gpt4 key购买 nike

因此,有很多关于如何从 ImageData 对象的 Uint32Array View 写入整个像素的示例。但是是否可以在不将计数器增加 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 位 View 中的单个偏移量读取整个像素?这就是我发现令人困惑的地方,下面的 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 ?

谢谢!

最佳答案

想通了,我需要将缓冲区本身传递给 Uint32Array 构造函数,而不是另一个 BufferView。

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

关于canvas - javascript ImageData 类型化数组读取整个像素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16679158/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com