在片段着色器中绘制一个矩形

时间:2014-04-18 13:19:51

标签: fragment webgl shader shape

我想知道是否有可能在片段着色器中绘制矩形而不使用任何if。我试过这个:

void main(void)
{ 

    vec2 resolution = vec2( 300.0, 300.0 );
    vec2 center = resolution / 2.0;
    vec2 position = ( gl_FragCoord.xy - center ) / resolution;

    if ( ( abs(position.x) < 0.5 ) && ( abs(position.y) < 0.5 ) )
        gl_FragColor = vec4( 0.0, 0.0, 1.0, 1.0 );
}

当我测试像素是否在矩形中时,我必须执行if测试。 如果你能帮助我的话,我认为有一个解决办法就是没有if?

1 个答案:

答案 0 :(得分:1)

我不确定你要做什么,但这是一个想法?

precision mediump float;

uniform float time;
uniform vec2 mouse; 
uniform vec2 resolution;

void main( void ) {

    vec2 position = ( gl_FragCoord.xy / resolution.xy ) + mouse / 4.0;

                   // x1  y1   x2   y2
    vec4 rect = vec4(0.2, 0.3, 0.4, 0.5);
    vec2 hv = step(rect.xy, position) * step(position, rect.zw);
    float onOff = hv.x * hv.y;

    gl_FragColor = mix(vec4(0,0,0,0), vec4(1,0,0,0), onOff);
}

Here's a working version