Javascript如何在CPU上重现GLSL浮点矩阵运算Uint8array

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

的数据是从第三方的API，将其打包Uint8Array顶点数据以套8 [x,y,z,w,r,g,b,a]

截至格式化直到现在来，我一直在GPU上执行此操作，通过这个Uint8array和旋转矩阵给GLSL。我将操作转移到脱机执行的基于CPU的脚本。

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

当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时，特别是负值，它们被转换为整数。例如-10〜= 246

，你可以在浏览器控制台重现具有：

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

我试图通过在Float32Array构造包装，并使用Float32Array.from转换Uint8Array为Float32Array，但它似乎产生相同的结果。

来源

2017-09-01 kevzettler

首先：请使用Float32Array作为顶点数据。你为什么使用'i + = 8;'？你的UInt8Array应该看起来像这样：'[X1，Y1，Z1，...]'或者[X1，Y1，Z1，W1，...]，所以你至少要跳过'i + = 8'每第二个垂直。 – Bellian

@Bellian我应该补充一点，顶点数据来自不容易更新的第三方来源。我可以将'Uint8Array'转换为'Float32Array'，此外，顶点格式实际上是8个属性[x，y，z，w，r，g，b，a]的集合，因此可以以8为单位进行迭代。 – kevzettler

首先：考虑使用Float32Array作为顶点信息。否则会出现大问题。或者至少使用非未签名的数据格式。

现在您的问题：

由于Uint8Array是一个无符号的数据格式，它只会保存正8位值。所有负值将被解释为正数（10000000作为有符号整数是-128，但作为无符号它是128）

但我想真正的问题是另一个。从代码，我认为要保存这样的顶点信息：

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

你的循环会迭代这个数组中的8个步骤，因为i+=8;。因此，至少每个第二个顶点将在您的脚本中被跳过。

来源

2017-09-01 12:37:40 Bellian

I updated该问题并回复了您对顶点数据格式的原始评论 – kevzettler

备案。我必须使用'.from'方法来转换数据'const vertData = Float32Array.from（getVertDataUint8（））;'当写入磁盘时，我必须使用'process.stdout.write（Buffer.from（vertData。缓冲液））;' – kevzettler

Javascript如何在CPU上重现GLSL浮点矩阵运算Uint8array

回答

相关问题