webgl - wie deklariere ich eine float-Variable

Question

super einfache Frage: Wie deklariere ich ordnungsgemäß eine float-Variable in Webgl?

Hintergrund:

ich mit diesem codepen ich spiele: http://codepen.io/jlfwong/pen/Wxjkxv

der Punkt dieses codepen ist, dass Sie die Farbe jedes Pixels in einem auf einem Render-Funktion basiert Shader gesetzt zu ermöglichen.

Ich bekomme die Grundlagen und ich habe die Dinge ziemlich gut funktioniert, aber dann habe ich versucht, "Phantasie" zu bekommen.

ich auf diesem Abschnitt bin konzentriert:

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

Alles, was ich tun möchte, ist step(25.0, mod(gl_FragCoord.x, 50.0)) aus einer Variablen zu speichern, damit ich dies versucht:

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

Dies nicht, weil es nicht funktioniert scheint eine Präzisionsdeklaration für float zu fehlen. hier ist der Fehler:

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

ich ein paar Dinge ausprobiert haben, dies zu beheben:

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

Auch habe googeln i und Eine Weile damit herumhantieren und ich ärgere mich nur darüber, Probleme zu haben ing eine Variable: P

TL; DR

Wie erkläre ich richtig ein float-Variable in webgl?/Was mache ich falsch?

Answer 1

Ich fand das Geheimnis! sieht aus wie float Präzision außerhalb Funktionen erklärt werden muss ...

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