Javascript如何在CPU Uint8array

Question

我在Uint8array中有一些数据（3d x，y，z坐标列表）。我需要执行一些浮点运算。 （矩阵旋转变换乘法）在这个3d向量上。我正在使用http://glmatrix.net/库进行计算。

数据来自第三方API，将其打包为Uint8Array顶点数据的格式为8 [x,y,z,w,r,g,b,a]

到目前为止，我一直在GPU上执行此操作，将此Uint8array和旋转矩阵传递给GLSL。我正在将操作移动到离线执行的基于CPU的脚本。

更新等式的另一部分。脱机脚本是一个node.js CLI脚本，它使用unix >运算符将最终缓冲区写入stdout并最终写入文件。然后我在最终的应用程序中加载它并用arrayBuffer构造函数包装typedArray。

在GLSL中执行时，操作如下：

matrix * vec4(vert.x, vert.y, vert.z, 1.0)

我的结果如下：

现在在CPU上我当前的代码尝试是：

  const vertData = getVertDataUint8();
  const rotation = mat4.fromRotation(mat4.identity([]), -Math.PI/2, [1,0,0]);
  var i = 0;
  while(i<vertData.length){
    const rotatedVerts = vec4.transformMat4([],
                                            vec4.clone([vertData[i],vertData[i+1],vertData[i+2], 1]),
                                            rotation);

    vertData[i] = rotatedVerts[0];
    vertData[i+1] = rotatedVerts[1];
    vertData[i+2] = rotatedVerts[2];
    i+=8;
  }

我的结果如下：

我注意到，当重新将值分配给vertData时，特别是负值，它们被转换为int。示例-10〜= 246

您可以在浏览器控制台中重现：

var u = new Uint8Array(1)
undefined
u[0] = -10
-10
u[0]
246

我尝试将Uint8Array转换为Float32Array，将其包装在Float32Array构造函数中并使用Float32Array.from，但它似乎会产生相同的结果。

Answer 1

首先：考虑使用Float32Array作为顶点信息。否则可能会出现大问题。或者至少使用非无符号数据格式。

现在你的问题：

由于Uint8Array是无符号数据格式，因此只保存正8位值。所有负值都将被解释为正数（10000000，因为有符号整数为-128，但是无符号值为128）

但我猜真正的问题是另一个问题。 从代码中我假设您正在保存顶点信息，如下所示：

[X1,Y1,Z1,...]或[X1,Y1,Z1,W1,...]

从i+=8;起，您的循环将以8为步长遍历数组。 因此，脚本中至少会跳过每个第二个顶点。