17

我在使用非常量 int 作为索引的片段着色器中访问数组时遇到问题。我已经删除了公式，因为无论如何它在这里没有多大意义，但我的代码旨在根据当前像素计算 tileID 并使用它来确定颜色。

这是我的代码：

int tileID = <Insert formula here>;

vec3 colorTest;

int arrayTest[1024];
for (int x = 0; x < 1024; x++) {
    if (x == 1) arrayTest[x] = 1;
    else arrayTest[x] = 2;
}

if (arrayTest[tileID] == 1) colorTest = vec3(0.0, 1.0, 0.0);
else if (arrayTest[tileID] == 2) colorTest = vec3(1.0, 0.0, 0.0);
else colorTest = vec3(0.0, 0.0, 0.0);

显然 GLSL 不喜欢这样，我得到了错误：

'[]' : 索引表达式必须是常量

有谁知道我将如何解决这个问题？谢谢。

4

3 回答 3

14

作为背景——GLSL 看起来很像 C，但编译起来有点不同。事情非常展开，条件可以并行执行并在最后切换，诸如此类。取决于硬件...

您可以使用循环索引或常量来索引数组。循环中的分配是可以的，但 tileID 的访问不是。

WebGL 着色器语言来自 GLES，记录在案

http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf

附录第 5 节讨论：

Indexing of Arrays, Vectors and Matrices
Definition:
constant-index-expressions are a superset of constant-expressions. Constant-index-expressions can include loop indices as defined in Appendix A section 4.
The following are constant-index-expressions:
• Constant expressions
• Loop indices as defined in section 4
• Expressions composed of both of the above
When used as an index, a constant-index-expression must have integral type.

希望有帮助！

哦，至于修复它，在上面的确切示例中......看起来你可以从 tileID 计算而不是预先计算和索引。

或者，预先计算您喜欢的任何数组，并将其作为纹理传递。当然，纹理可以按您喜欢的方式编入索引。

这是我使用的一个 javascript 辅助方法，用于将浮点数传递给着色器：

function glSetupStuff() { ...
...
if(!gl.getExtension("OES_texture_float"))   // <<-- enables RGBA float values, handy!
    alert("cant pass in floats, use 8-bit values instead.");
... }

/*
 * Pass in an array of rgba floats,
 * for example: var data = new Float32Array([0.1,0.2,0.3,1,  .5,.5,1.0,1]);
 */
function textureFromFloats(gl,width,height,float32Array) 
{
var oldActive = gl.getParameter(gl.ACTIVE_TEXTURE);
gl.activeTexture(gl.TEXTURE15); // working register 31, thanks.

var texture = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, texture);

gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 
                width, height, 0, 
                gl.RGBA, gl.FLOAT, float32Array);

gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
gl.bindTexture(gl.TEXTURE_2D, null);

gl.activeTexture(oldActive);

return texture;
}

请注意 gl.NEAREST 的使用，因此它不会“模糊”您的值！然后你可以在 gl.drawXxx 调用之前设置它，比如

textureUnit = 3;  // from 0 to 15 is ok
gl.activeTexture(gl.TEXTURE0 + textureUnit);
gl.bindTexture(gl.TEXTURE_2D, texture);

var z = gl.getUniformLocation(prog, "uSampler");
gl.uniform1i(z, textureUnit);

在着色器中（我相信片段或顶点；一些早期的 webgl 不支持顶点纹理......）

uniform sampler2D uSampler;
...
vec4 value = texture2D(uSampler, vec2(xValueBetween0And1,yValueBetween0And1));

因此，您必须在 0 到 1 的范围内对数组作为纹理的大小进行适当的索引。尝试从每个值/像素的中间进行采样。就像，如果数组是 2 个值宽，索引 0.25 和 0.75。

这就是它的要点！

于 2013-10-22T23:12:26.767 回答
5

在 OS X 10.11.6 上的 Safari 9.1.2 中测试

uniform float data[32];

float getData(int id) {
    for (int i=0; i<32; i++) {
        if (i == id) return data[i];
    }
}

void main(void) {
    float f = getData(yourVariable);
}
于 2016-08-20T22:28:03.310 回答
4

我遇到了这个错误，因为我试图使用一个整数变量从纹理数组中获取第 n 个纹理：

// this doesn't compile!

varying vec2 vUv; // uv coords
varying float vTexture; // texture index in array of textures

uniform sampler2D textures[3]; // identify that there are 3 textures

void main() {
  int textureIndex = int(floor(vTexture));
  gl_FragColor = texture2D(textures[textureIndex], vUv);
}

解决方案是将纹理索引分解为一系列条件：

// this compiles!

varying vec2 vUv; // uv coords
varying float vTexture; // texture index in array of textures

uniform sampler2D textures[3]; // identify that there are 3 textures

void main() {
  int textureIndex = int(floor(vTexture));
  if (textureIndex == 0) {
    gl_FragColor = texture2D(textures[0], vUv);
  } else if (textureIndex == 1) {
    gl_FragColor = texture2D(textures[1], vUv);
  } else if (textureIndex == 2) {
    gl_FragColor = texture2D(textures[2], vUv);
  } 
}
于 2018-04-30T22:35:45.487 回答