gl_FragData doit être une constante 0

Question

J'ai un problème en essayant de compiler un fragment shader. Je continue à obtenir cette erreur:

Uncaught Error: Fragment Shader Compiler Error: ERROR: 0:21: '[' : 
array index for gl_FragData must be constant zero ERROR: 0:21: '[' : 
array index for gl_FragData must be constant zero ERROR: 0:21: '[' : 
array index for gl_FragData must be constant zero 

Voici le code:

#ifdef GL_EXT_draw_buffers 
#extension GL_EXT_draw_buffers : require 
#endif 
#ifdef GL_ES 
precision highp float; 
#endif 
void main() { 
    gl_FragData[0] = vec4(1.,2.,3.,4.); 
    gl_FragData[1] = vec4(1.,2.,3.,4.); 
    gl_FragData[2] = vec4(1.,2.,3.,4.); 
    gl_FragData[3] = vec4(1.,2.,3.,4.); 
} 

L'ensemble de l'installation fonctionne très bien si je suis la mise en gl_FragColor (avec les 4 textures attachées à la mémoire tampon de trame), mais essayer pour faire le code ci-dessus (indexer les tampons à la sortie) semble ne pas compiler. J'ai vu cela fonctionner correctement dans WebGL1 en utilisant des extensions. J'utilise WebGL2, alors peut-être que quelque chose est différent dans ce contexte? (Je l'essaie dans la dernière version de Chrome).

Answer 1

Il semble donc qu'il y ait quelques changements à envisager de passer de WebGL1 à WebGL2. Étant donné le commentaire de @ gman, j'ai pensé qu'il était préférable de lier son article, car je sais qu'il est vraiment l'expert ici. ;)

WebGL 1 à WebGL 2 conversion: https://webgl2fundamentals.org/webgl/lessons/webgl1-to-webgl2.html

J'ai aussi trouvé utile de se rappeler la version differences:

WebGL 1.0 is based on OpenGL ES 2.0 and provides an API for 3D graphics. It uses the HTML5 canvas element and is accessed using Document Object Model (DOM) interfaces.

WebGL 2.0 is based on OpenGL ES 3.0 and made guaranteed availability of many optional extensions of WebGL 1.0 and exposes new APIs.

En un mot (se référant également au premier lien sur l'histoire) :

1. Mon code shader a été conçu pour des exemples que j'ai vus pour WebGL 1 (OpenGL ES 2) en utilisant des extensions. Cela a fonctionné correctement car OpenGL 2.0 prenait en charge plusieurs valeurs de couleur via gl_FragData.

2. En basculant vers WebGL 2 (OpenGL ES 3), cette méthode est dépréciée au profit d'une autre méthode. Maintenant, il y a out déclarations requises, comme out vec4 out_0; main(void) { out_0 = vec4(1.0, 0.0, 0.0, 1.0); }. Mais j'avais encore quelques problèmes. Il semble que je devais spécifier les emplacements de tampon. De plus, je recevais cette erreur:

   ERROR: must explicitly specify all locations when using multiple fragment outputs

   Ce qui signifie que je devais ajouter #version 300 es au sommet de mon programme, de sorte que le code correct pour WebGL 2 ressemble plus à ceci:

   #version 300 es 
   layout(location = 0) out vec4 out_0; 
   layout(location = 1) out vec4 out_1; 
   main(void) { 
       out_0 = vec4(1.0, 0.0, 0.0, 1.0); 
       out_1 = vec4(1.0, 0.0, 0.0, 1.0); 
   } 
   

   A un point que j'avais la mauvaise version, ce qui a provoqué cette erreur:

   invalid version directive ERROR: 0:24: 'out' : storage qualifier supported in GLSL ES 3.00 and above only

   Mais je trouve que la version pour WebGL 2 est spécifiquement #version 300 es (notez le es partie), qui a fonctionné! Remarque: Le spécificateur de version doit figurer sur la première ligne et, malheureusement, ne peut pas figurer dans une directive de préprocesseur (par exemple, #ifdef). J'ai donc dû modifier dynamiquement la chaîne avant de l'envoyer à compiler. Sinon, vous obtiendrez ceci:

   #version directive must occur before anything else, except for comments and white space

3. Pour vertex shaders, si compilé pour WebGL 2 (ES 3) note que attribute est maintenant in à la place.La version du vertex shader doit également correspondre à celle du fragment en cours de compilation, ou bien vous obtiendrez ceci:

   ERROR: Shader Linking Error: Versions of linked shaders have to match.

J'espère que toute cette confusion coller ensemble aide à sauver quelqu'un d'autre beaucoup de temps. ;)