격자만들기

pixgram·2022년 3월 26일
0
#ifdef GL_ES
precision mediump float;
#endif

uniform vec2 u_resolution;

vec3 get_square(vec2 st, vec2 start, vec2 end, vec3 color ) {
    vec2 left_bottom = step(start, st);
    vec2 right_top = step(end, 1.0 - st);
    
    return color * (left_bottom.x * left_bottom.y * right_top.x * right_top.y);
}

void main() {
    vec2 st = gl_FragCoord.xy/u_resolution.xy;
    vec3 canvas = vec3(0.0);
    const int squares = 3;
    float increments = 1.0 / float(squares);
    bool start_color = false;
    bool flip = start_color;
    
    for(int i = 0; i < squares; i++) {
        for(int j = 0; j < squares; j++) {
            vec3 square = get_square(
                st,
                vec2(increments * float(j), increments * float(i)),
                vec2(1.0 - increments * float(j + 1), 1.0 - increments * float(i + 1)),
                vec3(flip)
            );
            
            canvas = mix(canvas, square, square);
            flip = !flip;
        }
        start_color = !start_color;
        flip = start_color;
    }
    
    gl_FragColor = vec4(canvas, 1.0);
}
profile
Interactive Front-end Developer and WebGL Artist

0개의 댓글