opengl-es - 顶点万花筒着色器

Question

我正在尝试将片段着色器转换为顶点着色器(用于移动优化)

如下图所示，中心和右边缘的顶点有问题。 (这是一个具有 11 x 11 顶点的平面)

UV 当前从右侧映射，并围绕中心缠绕(径向旋转)。 我猜中间半部分的多个顶点具有相同的值，这会产生一个洞？ 然后右侧将第一个 UV 值交叉淡入淡出到最终值，从而产生拉伸(stretch)效果。

问题是如何覆盖或修复这些问题。 (它们可能是两个独立的问题？)

uniform vec2 _Offset;
uniform float _Multiply;
varying vec4 position;
varying vec4 vert;
varying vec2 tex;
varying vec2 uv;
varying float ar;
#ifdef VERTEX  
void main()
{          
    gl_Position = gl_ModelViewProjectionMatrix * gl_Vertex;
    vec2 p = -1.0 + 2.0 * tex.xy;
    float a = atan(p.y,p.x) ;
    float r = sqrt(dot(p,p));

    uv.x = _Multiply*a/3.1416 * 2.0 + 0.1;

    float sx = sin(_Multiply*r+_Offset.x);
    float sy = _Multiply*.1*cos(_Offset.y+_Multiply*a);
    uv.y = -_Offset.x + sx + sy;

}
#endif  

#ifdef FRAGMENT

uniform sampler2D _MainTex;
void main(void)
{

    gl_FragColor = texture2D(_MainTex,uv*.5);
}
#endif                          
ENDGLSL    

Answer 1

好吧，基本上重写了着色器，我能够得到预期的结果。 给新手的建议是:平面中的顶点数量越多，发生的像素失真就越少。

GLSLPROGRAM                          
#ifdef VERTEX  
varying vec2 position;
uniform float _Multiply;
uniform vec2 _Offset;
void main()
{          
    gl_Position = gl_ModelViewProjectionMatrix * gl_Vertex;
    vec2 tex = vec2(gl_MultiTexCoord0);

    vec2 p = tex.xy - 0.5;
    float r = length(p);
    float a = atan(p.y, p.x);
    float sides = _Multiply;
    float tau = 2.0 * 3.1416;
    a = mod(a, tau/sides);
    a = abs(a - tau/sides/2.0);
    position = r * vec2(cos(a), sin(a)) + 0.5  + _Offset;
}
#endif  
#ifdef FRAGMENT
varying vec2 position;
uniform sampler2D _MainTex;
void main(void)
{
    gl_FragColor = texture2D(_MainTex, position);
}
#endif                          
ENDGLSL