<OpenGL 12> GLSL WEB

Listo:

VScode + + glslCanvas glslLinter + Shadering idiomas apoyar + glslang

Ref: tutorial

NDC:

u_resolution vec2 uniforme; 
vec2 pos = gl_FragCoord.xy / u_resolution - vec2 ( 0.5 , 0.5 );

 

1: Esfera

#ifdef GL_ES 
precisión mediump flotador ;
#endif 

u_resolution vec2 uniforme; 
const  float = 1E- e 8 ; 

struct Forma {
     flotador sdf; 
    de color vec3; 
}; 

Combine_sdf Shape (Forma una, Forma b) { 
    temp Forma; 
    temp.sdf = min (a.sdf, b.sdf); 
    temp.color = A.Color * flotador (a.sdf <= 0,0 ) + B.Color * flotador (b.sdf <= 0,0 );
    volver temp; 
} 

Flotador circle_sdf (pos vec2, centro de vec2, flotadorradio) 
{ 
    retorno longitud (pos-centro) - radio; 
} 


Void main () 
{ 
    float radio = 0,2 ; 
    vec2 pos = gl_FragCoord.xy / u_resolution - vec2 ( 0.5 , 0.5 ); 
    Forma cle01 = Forma (circle_sdf (pos, vec2 (- 0,1 , 0,0 ), radio), vec3 ( 1 , 0 , 0 )); 
    Forma cle02 = Forma (circle_sdf (pos, vec2 ( 0.1 ,   0.0 ), radio), vec3 ( 0 , 0 , 1 ));
    Escena Forma = combine_sdf (cle01, cle02); 
    vec3 de color = flotador (scene.sdf <= 0,0 ) * scene.color; 
    gl_FragColor = vec4 (color, 1,0 ); 
    
}

Ver código