Do not render short bridges for medium zoom levels (#123)

Fixes #115

Changes:
- store way length of railway lines
- interpolate zoom level for a minimum length to render bridges
- tunnels are always rendered, unrelated to length

Before


![image](https://github.com/user-attachments/assets/e9a35218-6007-4837-867e-bcbf80090d59)

After 


![image](https://github.com/user-attachments/assets/193633a2-8402-488c-9362-2ca0ac08ca28)

Author: hiddewie

import/openrailwaymap.lua

@@ -67,6 +67,7 @@ local railway_line = osm2pgsql.define_table({
   columns = {
     { column = 'id', sql_type = 'serial', create_only = true },
     { column = 'way', type = 'linestring' },
+    { column = 'way_length', type = 'real' },
     { column = 'railway', type = 'text' },
     -- TODO build feature column
     { column = 'feature', type = 'text' },
@@ -519,8 +520,10 @@ function osm2pgsql.process_way(object)
       end
     end
 
+    local way = object:as_linestring()
     railway_line:insert({
-      way = object:as_linestring(),
+      way = way,
+      way_length = way:length(),
       railway = tags['railway'],
       service = tags['service'],
       usage = tags['usage'],

import/sql/tile_views.sql

@@ -4,6 +4,7 @@ CREATE OR REPLACE VIEW railway_line_high AS
     SELECT
         id,
         way,
+        way_length,
         railway,
         CASE
             WHEN railway = 'proposed' THEN COALESCE(proposed_railway, 'rail')
@@ -68,6 +69,7 @@ CREATE OR REPLACE VIEW railway_line_high AS
         (SELECT
              id,
              way,
+             way_length,
              railway,
              usage,
              service,

martin/configuration.yml

@@ -113,6 +113,7 @@ postgres:
       properties:
         # TODO calculate labels in frontend
         id: integer
+        way_length: number
         railway: string
         feature: string
         usage: string

proxy/js/styles.mjs

@@ -1213,55 +1213,6 @@ const layers = {
         'line-gap-width': railway_tunnel_casing_add,
       }
     },
-    {
-      id: 'railway_tunnel_fill',
-      type: 'line',
-      minzoom: 8,
-      source: 'high',
-      'source-layer': 'railway_line_high',
-      filter: ['all',
-        ['get', 'tunnel'],
-        ['!=', ['get', 'railway'], 'construction'],
-        ['!=', ['get', 'railway'], 'proposed'],
-        ['!=', ['get', 'railway'], 'abandoned'],
-        ['!=', ['get', 'railway'], 'razed'],
-      ],
-      layout: {
-        'line-join': 'round',
-        'line-cap': 'round',
-      },
-      paint: standardFillPaint([1]),
-    },
-    {
-      id: 'railway_tunnel_bright',
-      type: 'line',
-      minzoom: 8,
-      source: 'high',
-      'source-layer': 'railway_line_high',
-      filter: ['all',
-        ['get', 'tunnel'],
-        ['!=', ['get', 'railway'], 'construction'],
-        ['!=', ['get', 'railway'], 'proposed'],
-        ['!=', ['get', 'railway'], 'abandoned'],
-        ['!=', ['get', 'railway'], 'razed'],
-      ],
-      layout: {
-        'line-join': 'round',
-        'line-cap': 'round',
-      },
-      paint: {
-        ...standardFillPaint([1]),
-        'line-color': 'rgba(255, 255, 255, 50%)',
-      }
-    },
-    preferredDirectionLayer('railway_tunnel_preferred_direction', ['all',
-      ['get', 'tunnel'],
-      ['any',
-        ['==', ['get', 'preferred_direction'], 'forward'],
-        ['==', ['get', 'preferred_direction'], 'backward'],
-        ['==', ['get', 'preferred_direction'], 'both'],
-      ]
-    ]),
     {
       id: 'railway_line_casing',
       type: 'line',
@@ -1358,6 +1309,55 @@ const layers = {
         'line-dasharray': razed_dasharray,
       }
     },
+    {
+      id: 'railway_tunnel_fill',
+      type: 'line',
+      minzoom: 8,
+      source: 'high',
+      'source-layer': 'railway_line_high',
+      filter: ['all',
+        ['get', 'tunnel'],
+        ['!=', ['get', 'railway'], 'construction'],
+        ['!=', ['get', 'railway'], 'proposed'],
+        ['!=', ['get', 'railway'], 'abandoned'],
+        ['!=', ['get', 'railway'], 'razed'],
+      ],
+      layout: {
+        'line-join': 'round',
+        'line-cap': 'round',
+      },
+      paint: standardFillPaint([1]),
+    },
+    {
+      id: 'railway_tunnel_bright',
+      type: 'line',
+      minzoom: 8,
+      source: 'high',
+      'source-layer': 'railway_line_high',
+      filter: ['all',
+        ['get', 'tunnel'],
+        ['!=', ['get', 'railway'], 'construction'],
+        ['!=', ['get', 'railway'], 'proposed'],
+        ['!=', ['get', 'railway'], 'abandoned'],
+        ['!=', ['get', 'railway'], 'razed'],
+      ],
+      layout: {
+        'line-join': 'round',
+        'line-cap': 'round',
+      },
+      paint: {
+        ...standardFillPaint([1]),
+        'line-color': 'rgba(255, 255, 255, 50%)',
+      }
+    },
+    preferredDirectionLayer('railway_tunnel_preferred_direction', ['all',
+      ['get', 'tunnel'],
+      ['any',
+        ['==', ['get', 'preferred_direction'], 'forward'],
+        ['==', ['get', 'preferred_direction'], 'backward'],
+        ['==', ['get', 'preferred_direction'], 'both'],
+      ]
+    ]),
     {
       id: 'railway_construction_fill',
       type: 'line',
@@ -1447,6 +1447,12 @@ const layers = {
       'source-layer': 'railway_line_high',
       filter: ['all',
         ['get', 'bridge'],
+        ['>=', ['get', 'way_length'],
+          ['interpolate', ["exponential", .5], ['zoom'],
+            8, 0.008,
+            16, 0
+          ],
+        ],
         ['!=', ['get', 'railway'], 'construction'],
         ['!=', ['get', 'railway'], 'proposed'],
         ['!=', ['get', 'railway'], 'abandoned'],
@@ -1466,6 +1472,12 @@ const layers = {
       'source-layer': 'railway_line_high',
       filter: ['all',
         ['get', 'bridge'],
+        ['>=', ['get', 'way_length'],
+          ['interpolate', ["exponential", .5], ['zoom'],
+            8, 0.008,
+            16, 0
+          ],
+        ],
         ['!=', ['get', 'railway'], 'construction'],
         ['!=', ['get', 'railway'], 'proposed'],
         ['!=', ['get', 'railway'], 'abandoned'],