在 javascript 中解析 16 位 RGBA png答案

【问题标题】：parsing a 16 bit RGBA png in javascript在 javascript 中解析 16 位 RGBA png
【发布时间】：2014-02-24 19:14:10
【问题描述】：

我已经从 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;
}

【问题讨论】：

标签： javascript png rgba 16-bit

【解决方案1】：

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
}

【讨论】：