Three.js/GLSL - Преобразование пиксельной координаты в мировую координату

Question

У меня есть простой шейдер в приложении Three.js, который окрашивает экран в красный цвет. Тем не менее, я хочу покрасить все пиксели справа от данной позиции мира до другого цвета.

Я видел someanswers, что предлагают использовать varying vec4 worldCoord = gl_ModelViewMatrix * gl_Vertex;, но так как WebGL с помощью GLSLES, переменные, такие как gl_Vertex не доступны для меня.

---

вершинных шейдеров

<script type="x-shader/x-vertex" id="vertexshader"> 
    #ifdef GL_ES 
    precision highp float; 
    #endif 

    void main() 
    { 
     gl_Position = projectionMatrix * modelViewMatrix * vec4(position,1.0); 
    } 
</script> 

---

Фрагмент шейдер

<script type="x-shader/x-fragment" id="fragmentshader"> 
    #ifdef GL_ES 
    precision highp float; 
    #endif 

    float worldX = 10.0; //Or some other position in the WebGL world 

    void main() 
    { 
     if(gl_FragCoord.x > worldX) //FragCoord gives me coordinates relative to the screen 
     { 
      gl_FragColor = vec4(0.0, 1.0, 0.0, 1); 
     } 

     else 
     { 
      gl_FragColor = vec4(1.0, 0.0, 0.0, 1); 
     } 
    } 
</script> 

---

В: Как преобразовать положение пикселя в его мировое положение в WebGL, используя Three.js?

---

Answer 1

Ответ, полученный из Fiddle WestLangley здесь: http://jsfiddle.net/ST4aM/2/.

---

Vertex Shader

<script type="x-shader/x-vertex" id="vertexshader"> 
    #ifdef GL_ES 
    precision highp float; 
    #endif 

    varying float x; 
    varying float y; 
    void main() 
    { 
     gl_Position = projectionMatrix * modelViewMatrix * vec4(position,1.0); 
     x = position.x; 
     y = position.y; 
    } 
</script> 

---

Фрагмент Shader

<script type="x-shader/x-fragment" id="fragmentshader"> 
    #ifdef GL_ES 
    precision highp float; 
    #endif 

    varying float x; 
    varying float y; 

    void main() 
    { 
     if(x > somePosition) 
     { 
      gl_FragColor = vec4(0.0, 1.0, 0.0, 1); 
     } 

     else 
     { 
      gl_FragColor = vec4(1.0, 0.0, 0.0, 1); 
     } 
    } 
</script> 

---