Question

我正在研究一个尝试压缩数据数组的项目。到目前为止，我一直在使用Canvas元素和putImageData / getImageData进行计算。我知道通常Canvas和webGl用于图像处理，但在这种情况下我将像素值转换为我需要的数字并且它工作正常。

我想使用webGl来执行压缩/解压缩，因为它的速度提高了。但是根据我的理解，webGl在它可以计算的数学类型方面有些限制。

所以我的问题是，是否可以移植以下＆＃34;逻辑＆＃34;进入webgl，vs使用普通的javascript运行计算？

这是我试图复制的逻辑。我们假设您有一系列数据如下所示：

1,2,3,4,5,10,11,12,13,16,17,18,19

此数组中的模式是它向上计数1，但偶尔会跳过几个数字然后重新开始。我利用这种模式的方法是将这个单个数组转换为2个数组。

第一个数组跟踪＆＃34;其中＆＃34;数字＆＃34;跳跃＆＃34;。第二个数组在每次跳转后跟踪第一个数字，所以我知道从哪里开始再次计数。

因此压缩数据如下所示：第一个数组（存储跳转的位置）：1,6,10 第二个数组（存储每次跳转的值）：1,10,16

我＆＃34;重建的方式＆＃34;使用canvas imgData处理的原始数组是for for循环。该计划如下：

//Setup some variables
var jumpDistance = 0;
var y = 0;

for(x = 0; x < 13; x ++){  //13 is the length of the original array

    jumpDistance = firstArray[y];
    originalArray[x] = originalArray[x] + secondArray [y];

    for(var jd = 1; jd < jumpDistance + 1; jd ++){
        originalArray[x + jd] = originalArray[x + jd] + 1;
    }

    y = y + 1;
    x = x + jumpDistance;
}

我希望在webGl中复制的主要逻辑是如何以更快的速度构建最终阵列＆＃34;然后我读完了构建它的前2个数组。

我知道webGl能够读取当前像素周围的其他像素。但是，无论如何要根据已经存储在另一个数组中的数据来读取某个像素？如果可以的话请告诉我！

非常感谢你！

Answer 1

但是，无论如何要根据已经存储在另一个数组中的数据来读取某个像素？

WebGL使用纹理坐标从纹理（数据数组）中查找数据。因此，您可以使用一个纹理的结果来查找另一个纹理的数据。

// get a pixel from someTexture (a type of array)
vec4 pixel = texture2D(someTexture, someTextureCoordinate);

// use it to look up data from another texture (a type of array)
vec2 otherTexCoord = pixel.xy;  // OR whatever math you want
vec4 pixel2 = texture2D(someTexture2, otherTexCoord);

webgl是否可以在处理像素时使用逻辑

1 个答案: