Fix for flickering of aliased thin lines by widening lines and

diluting frag colors.

GitOrigin-RevId: 2b7f0ea679404f21da4c4c8cc8e8ecde8f1d9a3c

Author: astojilj

src/shaders/line.fragment.glsl

@@ -11,7 +11,7 @@ uniform highp vec2 u_trim_fade_range;
 uniform highp vec2 u_trim_gradient_mix_range;
 uniform lowp vec4 u_trim_color;
 
-in vec2 v_width2;
+in vec4 v_width2_dilute;
 in vec2 v_normal;
 in float v_gamma_scale;
 in highp vec3 v_uv;
@@ -75,16 +75,17 @@ void main() {
     #pragma mapbox: initialize lowp float emissive_strength
 
     // Calculate the distance of the pixel from the line in pixels.
-    float dist = length(v_normal) * v_width2.s;
+    float dist = length(v_normal) * v_width2_dilute.x;
 
     // Calculate the antialiasing fade factor. This is either when fading in
-    // the line in case of an offset line (v_width2.t) or when fading out
-    // (v_width2.s)
+    // the line in case of an offset line (v_width2_dilute.y) or when fading out
+    // (v_width2_dilute.x)
 #ifdef VARIABLE_LINE_WIDTH
     blur = mix(blur, 0.0, stub_side);
 #endif
+    float diluted_opacity = opacity * v_width2_dilute.z;
     float blur2 = (u_width_scale * blur + 1.0 / u_device_pixel_ratio) * v_gamma_scale;
-    float alpha = clamp(min(dist - (v_width2.t - blur2), v_width2.s - dist) / blur2, 0.0, 1.0);
+    float alpha = clamp(min(dist - (v_width2_dilute.y - blur2), v_width2_dilute.x - dist) / blur2, 0.0, 1.0);
 #ifdef VARIABLE_LINE_WIDTH
     alpha = mix(alpha, 1.0, stub_side);
 #endif
@@ -141,7 +142,7 @@ void main() {
 #ifdef RENDER_LINE_BORDER
 #ifndef VARIABLE_LINE_WIDTH
     float edgeBlur = ((border_width * u_width_scale) + 1.0 / u_device_pixel_ratio);
-    float alpha2 = clamp(min(dist - (v_width2.t - edgeBlur), v_width2.s - dist) / edgeBlur, 0.0, 1.0);
+    float alpha2 = clamp(min(dist - (v_width2_dilute.y - edgeBlur), v_width2_dilute.x - dist) / edgeBlur, 0.0, 1.0);
     if (alpha2 < 1.) {
         float smoothAlpha = smoothstep(0.6, 1.0, alpha2);
         if (border_color.a == 0.0) {
@@ -156,6 +157,7 @@ void main() {
         } else {
             out_color = mix(border_color * trim_alpha, out_color, smoothAlpha);
         }
+        out_color *= v_width2_dilute.w;
     }
 #endif
 #endif
@@ -176,7 +178,7 @@ void main() {
     out_color = fog_dither(fog_apply_premultiplied(out_color, v_fog_pos));
 #endif
 
-    out_color *= (alpha * opacity);
+    out_color *= (alpha * diluted_opacity);
 
 #ifdef INDICATOR_CUTOUT
     out_color = applyCutout(out_color, v_z_offset);

src/shaders/line.vertex.glsl

@@ -60,7 +60,7 @@ float sample_elevation(vec2 apos) {
 #endif
 
 out vec2 v_normal;
-out vec2 v_width2;
+out vec4 v_width2_dilute; // xy fow width, z for dilute of whole line w for dilute of border
 out float v_gamma_scale;
 out highp vec3 v_uv;
 #ifdef ELEVATED_ROADS
@@ -230,6 +230,8 @@ void main() {
     // moved them into the shader for clarity and simplicity.
     gapwidth = gapwidth / 2.0;
     float halfwidth;
+    float dilute_scale = 1.0;
+    float dilute_border_scale = 1.0;
 #ifdef VARIABLE_LINE_WIDTH
     float left_width = a_z_offset_width.y;
     float right_width = a_z_offset_width.z;
@@ -283,7 +285,7 @@ void main() {
     vec2 projected_extrude_xy = projected_extrude.xy;
 #ifdef ELEVATED_ROADS
     v_road_z_offset = a_z_offset;
-    gl_Position = u_matrix * vec4(pos + offset2 * u_pixels_to_tile_units, a_z_offset, 1.0) + projected_extrude;
+    gl_Position = u_matrix * vec4(pos + offset2 * u_pixels_to_tile_units, a_z_offset, 1.0);
 #else
 #ifdef ELEVATED
     vec2 offsetTile = offset2 * u_pixels_to_tile_units;
@@ -321,10 +323,47 @@ void main() {
     gl_Position.z -= (gl_Position.w * zbias);
     gl_Position = mix(gl_Position, AWAY, hidden);
 #else // ELEVATED
-    gl_Position = mix(u_matrix * vec4(pos + offset2 * u_pixels_to_tile_units, 0.0, 1.0) + projected_extrude, AWAY, hidden);
+    gl_Position = u_matrix * vec4(pos + offset2 * u_pixels_to_tile_units, 0.0, 1.0);
 #endif // ELEVATED
 #endif // ELEVATED_ROADS
 
+#ifndef ELEVATED
+#ifndef VARIABLE_LINE_WIDTH
+#ifndef RENDER_TO_TEXTURE
+    // Scale up sub-pixel extrusions of inner line width to ensure minimum half-pixel visibility
+    float base_w = gl_Position.w;
+    vec2 screen_width = abs(projected_extrude.xy / base_w * u_units_to_pixels);
+    float max_extrude_component = max(screen_width.x, screen_width.y);
+    if (base_w > 0.0 && max_extrude_component > 0.0001) {
+        float min_pixel = 1.05; // u_units_to_pixels is [2 / width, 2 / height], not using half pixel for halfwidth here
+        if (max_extrude_component < min_pixel) {
+            vec2 abs_pos = abs(gl_Position.xy);
+            float is_out = max(abs_pos.x, abs_pos.y) / base_w;
+            // smoothly disable dilute for a very long lines outside viewport (2.5 -> 4.5)
+            // bump width here and reduce opacity in fragment shader by dilute_scale factor
+            dilute_scale = mix(max_extrude_component / min_pixel, 1.0, smoothstep(2.5, 4.5, is_out));
+            projected_extrude /= dilute_scale;
+        }
+        else
+        {
+#ifdef RENDER_LINE_BORDER
+            // if line is wide enough, reduce opacity of thin borders only - no change of border width
+            float border_ratio = (border_width * u_width_scale + ANTIALIASING) / outset;
+            screen_width *= border_ratio;
+            float max_border_component = max(screen_width.x, screen_width.y);
+            dilute_border_scale = min(1.0, max_border_component / min_pixel);
+#endif
+        }
+    }
+#endif
+#endif
+#ifdef ELEVATED_ROADS
+    gl_Position = gl_Position + projected_extrude;
+#else
+    gl_Position = mix(gl_Position + projected_extrude, AWAY, hidden);
+#endif
+#endif
+
 #ifdef ELEVATED_ROADS
 #ifdef RENDER_SHADOWS
     vec3 shd_pos = vec3(pos + (offset2 + dist) * u_pixels_to_tile_units, a_z_offset);
@@ -371,7 +410,7 @@ void main() {
     v_tex = vec2(a_linesofar * scale / (floorwidth * u_floor_width_scale), (-normal.y * height + dash.x + 0.5) / u_texsize.y);
 #endif
 
-    v_width2 = vec2(outset, inset);
+    v_width2_dilute = vec4(outset, inset, dilute_scale, dilute_border_scale);
 
 #ifdef FOG
     v_fog_pos = fog_position(pos);

test/integration/render-tests/3d-intersections/guard-rail-color-feature-dependent/expected.png

@@ -3,7 +3,7 @@
     "metadata": {
         "test": {
             "mapMode": "static",
-            "allowed": 0.00026,
+            "allowed": 0.0003,
             "spriteFormat": "raster"
         }
     },

test/integration/render-tests/3d-intersections/guard-rail-color-feature-dependent/style.json

@@ -2,7 +2,8 @@
   "version": 8,
   "metadata": {
     "test": {
-      "showOverdrawInspector": true
+      "showOverdrawInspector": true,
+      "allowed":  0.0003
     }
   },
   "center": [