Выражение индекса должно быть постоянным - ошибка WebGL / GLSL

В качестве фона - 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.

В этом суть!

Протестировано в Safari 9.1.2 на OS X 10.11.6

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);
}

Я столкнулся с этой ошибкой, потому что пытался использовать целочисленную переменную, чтобы взять 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);
  } 
}