gl_FragDataはゼロにする必要があります

Question

フラグメントシェーダのコンパイルに問題があります。私はこのエラーを取得しておいてください。

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 

これはコードです：

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

私は（フレームバッファに取り付けた4つのテクスチャ付き）gl_FragColorを設定するが、しようとしている場合は、全体のセットアップが正常に動作します上のコードを実行すると（出力先にバッファをインデックスする）、コンパイルされないようです。私は拡張機能を使用してWebGL1でうまく動作するのを見てきました。私はWebGL2を使用しているので、多分この文脈では何かが違うでしょうか？ （私はそれをChromeの最新バージョンで試しています）。

Answer 1

WebGL1からWebGL2に移行することを検討するにはいくつかの変更があるようです。 @ gmanのコメントがあれば、私は彼が本当にここの専門家であることを知っているので、彼の記事にリンクするのが最善だと思った。私はまた、それが人バージョンdifferences覚えることが見出さhttps://webgl2fundamentals.org/webgl/lessons/webgl1-to-webgl2.html

：; WebGLの2への変換）

WebGLの1

一言で言えば

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.

を（）歴史上の最初のリンクも参照：

1. シェーダコードは、拡張機能を使用してWebGL 1（OpenGL ES 2）で見た例で設計されています。これは、OpenGL 2.0が複数のカラー値をgl_FragDataでサポートしていたためうまく機能しました。

2. WebGL 2（OpenGL ES 3）に切り替えると、別の方法で償却されます。今度はoutの宣言が必要です（out vec4 out_0; main(void) { out_0 = vec4(1.0, 0.0, 0.0, 1.0); }など）。しかし、私はまだいくつかの問題を抱えていました。私はバッファの場所を指定する必要があるようです。また、私はこのエラーを取得しました。

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

   時：私は私のプログラムの先頭に#version 300 esを追加するために必要なので、WebGLの2のための正しいコードをよりこのようになっていることを意味し

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

   私はこのエラーの原因間違ったバージョン、持っていたワンポイント：

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

   をしかし、私はWebGLの2のバージョンは、特に#version 300 esであることが判明（に気付きます部分）、これはうまくいった！

   注：バージョン指定子はFIRST行に指定する必要があります。残念ながら、プリプロセッサーディレクティブ（つまり#ifdef）に入れることはできません。したがって、コンパイルする前に動的に文字列を変更する必要がありました。 WebGLの2（ES 3）のためにコンパイルされた場合、頂点シェーダで

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

3. attributeではなく、今inであることに注意してください。そうでない場合、あなたはこれを取得します。頂点シェーダのバージョンもコンパイルされるフラグメントのそれと一致している必要があり、さもなければ、あなたは、この取得します：私は一緒にすべてのこの混乱を糊付けすることは、他の誰か多くの時間を節約することができます願ってい

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

を。 ;）