在javascript中解析16位RGBA png

时间:2014-02-24 19:14:10

标签: javascript png rgba 16-bit

我从16位RGBA png中提取原始像素,并尝试将颜色和alpha分离为2个独立的TypedArray。

对于8位RGBA,这是有效的,

var pixels = myRawPixels, // a Uint32Array
    len = pixels.length,
    colorData = new Uint8Array(len * 3),
    alphaData = new Uint8Array(len),
    pixel,
    i = 0,
    n = 0;

for(; i < len; i++) {
    pixel = pixels[i];

    colorData[n++] = (pixel >>> 0) & 0xff; // R
    colorData[n++] = (pixel >>> 8) & 0xff;  // G
    colorData[n++] = (pixel >>> 16) & 0xff;  // B

    alphaData[i] = (pixel >>> 24) & 0xff;
}

但是由于JS中缺少64位整数,我很难弄清楚等价物如何寻找16位图像?

var pixels = myRawPixels, // Uint32Array
    len = pixels.length,
    imgData = new Uint16Array((len * 0.5) * 3),
    alphaData = new Uint16Array(len * 0.5),
    i = 0, n = 0, a = 0,
    pixel;

for(; i < len; i++) {
    pixel = pixels[i] | pixels[i++];

    imgData[n++] = pixel >>> 0;
    imgData[n++] = pixel >>> 16;
    imgData[n++] = pixel >>> 32;

    alphaData[a++] = pixel >>> 48;
}

1 个答案:

答案 0 :(得分:0)

pixel = pixels[i] | pixels[i++];

这不会将它们连接到64位int(无论如何你都希望pixels[++i])。相反,在两个索引上分别访问16位数字:

while(i < len) {
    pixel = pixels[i++];
    colorData[n++] = (pixel >>> 0)  & 0xffff; // R
    colorData[n++] = (pixel >>> 16) & 0xffff; // G
    pixel = pixels[i++];
    colorData[n++] = (pixel >>> 0)  & 0xffff; // B
    alphaData[a++] = (pixel >>> 16) & 0xffff; // A
}