2016-03-26 88 views
1

在我的顶点着色器中,我希望修改片段着色器中共享的attribute vec2 a_position变量。通过这个修改,我应该将图像转化为圆柱投影。
这是我在做什么,我着色器:修改属性vec2变量

<!-- vertex shader --> 
<script id="2d-vertex-shader" type="x-shader/x-vertex"> 
    attribute vec2 a_position; 

    uniform vec2 u_resolution; 
    uniform mat3 u_matrix; 

    varying vec2 v_texCoord; 

    void main() { 
     // modifying START 
     float angle = atan(a_position.y, a_position.x); 
     float r = sqrt(a_position.x*a_position.x + a_position.y*a_position.y); 
     a_position.x = r*cos(angle); 
     a_position.y = r*sin(angle); 
     // modifying STOP 
     gl_Position = vec4(u_matrix * vec3(a_position, 1), 1); 
     v_texCoord = a_position; 
    } 
</script> 

<!-- fragment shader --> 
<script id="2d-fragment-shader" type="x-shader/x-fragment"> 
    precision mediump float; 

    // our texture 
    uniform sampler2D u_image; 

    // the texCoords passed in from the vertex shader. 
    varying vec2 v_texCoord; 

    void main() { 
     gl_FragColor = texture2D(u_image, v_texCoord); 
    } 
</script> 

但我发现了这个错误:

compiling shader '[object WebGLShader]':ERROR: 0:12: 'assign' : l-value required "a_position" (can't modify an attribute) ERROR: 0:13: 'assign' : l-value required "a_position" (can't modify an attribute)

你没有任何想法如何解决呢?

回答

3

只需使用另一个变量

attribute vec2 a_position; 

uniform vec2 u_resolution; 
uniform mat3 u_matrix; 

varying vec2 v_texCoord; 

void main() { 
    // modifying START 
    float angle = atan(a_position.y, a_position.x); 
    float r = sqrt(a_position.x*a_position.x + a_position.y*a_position.y); 
    vec3 p = vec3(
    r*cos(angle), 
    r*sin(angle), 
    1); 
    // modifying STOP 
    gl_Position = vec4(u_matrix * p, 1); 
    v_texCoord = a_position; 
} 
+0

伟大的作品,谢谢! –