Hello guys,
I just started to learn opengl. At the moment I try to draw antialiased ring which has a width of 1 pixel.
The outer edge looks pretty smooth, but inner edge is not.
Could you help to improve this?
https://i.imgur.com/YBlZpJC.png
Thats how my shader looks like:
uniform vec2 u_resolution;
uniform float u_width;
uniform vec4 u_color;
void main() {
float alpha = u_color[3];
float delta = 0.0;
vec2 st = gl_FragCoord.xy/u_resolution; // normalize resolution 0 to 1
float pixel = 1.0 / u_resolution.x; // normalized size of 1 pixel
st = st * 2.0 - 1.0; // set range from -1 to 1
float len = dot(st, st); // compute squared vec len from center to coordinate
float r2 = 1.0 - pixel;
delta = fwidth(len);
alpha = alpha - smoothstep(1.0 - delta, 1.0 + delta, len);
if ( alpha == u_color[3])
alpha = alpha- smoothstep(r2 + delta, r2 - delta, len);
gl_FragColor = u_color * alpha;
}