webgl - 浮動小数点変数を宣言するにはどうすればいいですか？

Question

超簡単な質問：webglにfloat変数を正しく宣言するにはどうすればよいですか？

背景：

私はこのcodepenで遊んだ：http://codepen.io/jlfwong/pen/Wxjkxv

このcodepenのポイントは、あなたがレンダリング機能に基づいてシェーダ内の各ピクセルの色を設定できるようにすることです。

私は基本を得て、かなりうまく動作していますが、それから私は "気の利いた"ものを得ようとしました。

私は、このセクションに焦点を当てている：私はこれを試した私がやりたいすべての変数を切っstep(25.0, mod(gl_FragCoord.x, 50.0))保存され

var fragmentShader = compileShader('       \n\ 
    void main(){             \n\ 
    gl_FragColor = vec4(step(25.0, mod(gl_FragCoord.x, 50.0)), \n\ 
         step(25.0, mod(gl_FragCoord.x, 50.0)), \n\ 
         step(25.0, mod(gl_FragCoord.x, 50.0)), \n\ 
         1.0);         \n\ 
    }               \n\ 
', context.FRAGMENT_SHADER); 

：

var fragmentShader = compileShader('       \n\ 
    void main(){             \n\ 
    float x_thing = step(25.0, mod(gl_FragCoord.x, 50.0));  \n\ 
                   \n\ 
    gl_FragColor = vec4(x_thing, x_thing, x_thing, 1.0);  \n\ 
    }               \n\ 
', context.FRAGMENT_SHADER); 

これだので動作しません。 floatの精度宣言が欠落しているようです。私はこの問題を解決するためにいくつかのことを試してみました

uncaught exception: Shader compile failed with: ERROR: 0:3: '' : No precision specified for (float) 

：ここでエラーです。また

• precision float x_thing = step(25.0, mod(gl_FragCoord.x, 50.0));
• precision highp float x_thing = step(25.0, mod(gl_FragCoord.x, 50.0));
• precision highp float; float x_thing = step(25.0, mod(gl_FragCoord.x, 50.0));

私はグーグルでてきたが、とこれをしばらく参考にしてみると、私は問題を宣言しているだけで迷惑になります変数をINGの：P

TL; DR

は、どのように私は適切にWebGLのフロート変数を宣言するのですか？ /私は間違って何をしていますか？

Answer 1

私は秘密を見つけました！ float精度は外の関数を宣言する必要がありますように...見える

var fragmentShader = compileShader('      \n\ 
    precision highp float;         \n\ 
                  \n\ 
    void main(){            \n\ 
    float x_thing = step(25.0, mod(gl_FragCoord.x, 50.0)); \n\ 
    gl_FragColor = vec4(x_thing,       \n\ 
         x_thing,       \n\ 
         x_thing,       \n\ 
         1.0);        \n\ 
    }              \n\ 
', context.FRAGMENT_SHADER);