顶点着色器中的WebGL 32位浮点

Question

有没有办法在WebGL着色器中获得32位浮点数？我将大量数据打包到4个无符号字节中，我不希望将其拆分成3个字节，因为这会增加客户端的计算。

例如，对于三对打包的数据，我显然更喜欢这种布局：

|u0 u1 u2 u3|u4 u5 u6 u7|u8 u9 u10 u11|

而不是这样：

|u0 u1 u2|u3 u4 u5|u6 u7 u8|u9 u10 u11|

这不仅添加了一个浮点数来添加通过总线发送的数据，而且还让我在客户机上生成24位数字，而不是简单地使用自动处理4个字节的Float32Array。

Answer 1

我真的不理解你的问题，但是如果你想上传字节到WebGL，为什么不直接传递字节呢？

var data = new Uint8Array([1,2,3,4,5,6,7,8]);
var buf = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, buf);
gl.bufferData(gl.ARRAY_BUFFER, data, gl.STATIC_DRAW);

...

gl.enableVertexAttribArray(someLoc);

var numComponents = 4;  // number of bytes to pull out each time
var type = gl.BYTE;     // BYTE goes from -128 to +127 or -1.0 to 1.0
                        // UNSIGNED_BYTE goes from 0 to 255 or 0.0 to 1.0
var normalize = false;  // false = use the value as is (-128 to +127 for BYTE,
                        // 0 to 255 for UNSIGNED_BYTE). 
                        // true = convert to -1.0 to +1.0 for BYTE or 0 to 1.0 for
                        // UNSIGNED_BYTE
var stride = 0;         // 0 means just advance numComponents * sizeof type.
var offset = 0;         // how far into your buffer to start.
gl.vertexAttribPointer(someLoc, numComponents, type, normalize, stride, offset);

如果您使用的是Uint8Array或Int8Array，那么似乎没有任何特殊的工作需要在值中“打包”，因此拥有numComponents = 3并不比numComponents = 4更难或更容易。您只需直接设置每个组件。同样的，也没有解包的工作，GL会帮你解包。