From 5a840743dad53f5869c17516d9e4d35173b34a03 Mon Sep 17 00:00:00 2001 From: Christian Gick Date: Fri, 3 Apr 2026 15:57:49 +0300 Subject: [PATCH] fix: choropleth below labels + hide country names at zoom < 3 Insert fill/outline layers before first label layer so text stays readable. Country/place labels only visible at zoom >= 3. Co-Authored-By: Claude Opus 4.6 (1M context) --- layouts/shortcodes/world-map.html | 20 +++++++++++++++++++- 1 file changed, 19 insertions(+), 1 deletion(-) diff --git a/layouts/shortcodes/world-map.html b/layouts/shortcodes/world-map.html index e86ce73..44814d3 100644 --- a/layouts/shortcodes/world-map.html +++ b/layouts/shortcodes/world-map.html @@ -80,6 +80,16 @@ function ifkInitMap() { window._ifkMap.addSource('countries-choropleth', { type: 'geojson', data: geo }); + // Find first label layer to insert choropleth below it + var firstLabel; + var layers = window._ifkMap.getStyle().layers; + for (var i = 0; i < layers.length; i++) { + if (layers[i].type === 'symbol' && (layers[i].id.indexOf('label') >= 0 || layers[i].id.indexOf('name') >= 0 || layers[i].id.indexOf('place') >= 0)) { + firstLabel = layers[i].id; + break; + } + } + window._ifkMap.addLayer({ id: 'choropleth-fill', type: 'fill', @@ -88,7 +98,7 @@ function ifkInitMap() { 'fill-color': ['get', 'fillColor'], 'fill-opacity': ['get', 'fillOpacity'] } - }); + }, firstLabel); window._ifkMap.addLayer({ id: 'choropleth-outline', @@ -98,6 +108,14 @@ function ifkInitMap() { 'line-color': '#94a3b8', 'line-width': 0.6 } + }, firstLabel); + + // Hide country labels below zoom 3 + layers.forEach(function(l) { + if (l.type === 'symbol' && (l.id.indexOf('country') >= 0 || l.id.indexOf('place') >= 0 || l.id.indexOf('continent') >= 0)) { + window._ifkMap.setLayoutProperty(l.id, 'visibility', 'visible'); + window._ifkMap.setLayerZoomRange(l.id, 3, 24); + } }); var popup = new maplibregl.Popup({ closeButton: true, closeOnClick: false, maxWidth: '280px' });