Remove the map caption, and make the globe projection reach MapLibre

The caption "UPG choropleth - click a country to filter - click a pin to select" is gone, along with its now-dead .rd-maptag rule and a comment that claimed the bottom-left corner was occupied. GLOBE: the projection default was already 'globe', but the request was not arriving. Mapbox GL takes setProjection('globe') -- a bare string. MapLibre v5 takes setProjection({type:'globe'}) -- an object. Passing a string to MapLibre throws, an empty catch swallowed it, and the map silently fell back to flat mercator with no console error. That is why it appeared exactly when the dashboard moved to provider maplibre. Now tries the object form first, then the string, so one call serves both engines. The catch stays so an engine with no projection support degrades rather than breaking the panel -- but it now catches a real unsupported case instead of masking a shape mismatch.
2026-09-23 20:39:18 +00:00 · 2026-09-23 20:39:18 +00:00 · 1dec28b2d8
commit 1dec28b2d8
parent d9fbff14bb
8 changed files with 39 additions and 28 deletions
--- a/plugin-designs/research-dashboard/src/components/dashboards/DashboardMapPanel.vue
+++ b/plugin-designs/research-dashboard/src/components/dashboards/DashboardMapPanel.vue
@ -1310,7 +1310,21 @@ function syncAttribClearance() {

 // ── RDASH-ENHANCE: GLOBE (default) <-> MERCATOR projection toggle ──
 const projection = ref('globe')
-function applyProjection() { const m = map.value; if (m) { try { m.setProjection(projection.value) } catch (_) {} } }
+// ★ THE TWO ENGINES DISAGREE ON THIS ONE CALL, AND THE CATCH HID IT (Driver 2026-09-23: "the map
+// style is not a globe"). Mapbox GL takes setProjection('globe') -- a bare string. MapLibre v5 takes
+// setProjection({ type: 'globe' }) -- an object. Passing a string to MapLibre throws, the empty
+// catch below swallowed it, and the map silently fell back to flat mercator with NO console error.
+// That is why this appeared the moment the dashboard moved to provider:'maplibre': the default was
+// still 'globe' and the request simply stopped arriving.
+// Try the object form first (MapLibre, and harmless to attempt), then the string (Mapbox). The catch
+// stays because a provider without ANY projection support must degrade rather than break the panel --
+// but it now catches a genuine unsupported-engine case instead of masking a shape mismatch.
+function applyProjection() {
+  const m = map.value
+  if (!m || typeof m.setProjection !== 'function') return
+  try { m.setProjection({ type: projection.value }); return } catch (_) { /* not the object form */ }
+  try { m.setProjection(projection.value) } catch (_) { /* engine has no projection support */ }
+}
 function toggleProjection() { projection.value = projection.value === 'globe' ? 'mercator' : 'globe'; applyProjection() }

 // ── RDASH-ENHANCE: fly-to on selection. Any facet brush (tree node / chart slice / region / row)
@ -1493,7 +1507,6 @@ watch(() => JSON.stringify(filterSet), () => { clearTimeout(_flyT); _flyT = setT
 useShadowStyles(`
  .rd-mapwrap{ position:relative; width:100%; height:100%; min-height:0; background:var(--dx-line, #d1d4cd); }
  .rd-mapwrap .rd-mapc{ position:absolute; inset:0; }
-  .rd-maptag{ position:absolute; left:8px; bottom:8px; z-index:2; font-size:10px; color:#33415588; background:#ffffffcc; padding:2px 6px; border-radius:4px; }
  .rd-proj{ position:absolute; right:8px; top:8px; z-index:3; font-size:11px; font-weight:700; cursor:pointer; user-select:none;
    background:#1a1a2ecc; color:#fff; border:1px solid #ffffff33; border-radius:6px; padding:4px 9px; backdrop-filter:blur(4px); }
  .rd-proj:hover{ background:#1a1a2e; }
@ -1528,7 +1541,8 @@ useShadowStyles(`
     The fix RAISES THE LEGEND, and never touches the attribution: nothing here hides, shrinks
     or restyles .mapboxgl-ctrl-attrib. --rd-attrib-clear is the reserved strip along the bottom
     edge that the credit line owns; the legend's bottom edge starts above it.
-     Bottom-LEFT was not available — .rd-maptag already holds that corner.
+     Bottom-LEFT was not available when this was written (a caption held that corner; it has since
+     been removed, so the corner is free if a future control needs it).
     Stays on the right so the legend sits beside the choropleth it explains. */
  .rd-mapwrap{ --rd-attrib-clear:26px; }
  .rd-legend-map{ position:absolute; right:8px; bottom:calc(var(--rd-attrib-clear,26px) + 8px); z-index:2;
@ -1589,7 +1603,6 @@ useShadowStyles(`
    <span class="rd-proj" role="button" tabindex="0" data-proj-toggle @click="toggleProjection">
      {{ projection === 'globe' ? '🌐 Globe' : '▭ Flat' }}
    </span>
-    <div class="rd-maptag">UPG choropleth · click a country to filter · click a pin to select</div>
    <div class="rd-legend-map" data-map-legend aria-label="UPG count legend">
      <div class="lg-h">UPGs / country</div>
      <div v-for="b in LEGEND_BINS" :key="b.l" class="lg-row">
--- a/public/doxa-maps/dashboard-plus-grid/dashboard-plus-grid.js
+++ b/public/doxa-maps/dashboard-plus-grid/dashboard-plus-grid.js
--- a/public/doxa-maps/dashboard-plus-grid/dashboard-plus-grid/default/index.html
+++ b/public/doxa-maps/dashboard-plus-grid/dashboard-plus-grid/default/index.html
@ -40,7 +40,7 @@

  <script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
  <!-- Bundle IIFE — registers the <dashboard-plus-grid> custom element. -->
-  <script src="../../dashboard-plus-grid.js" integrity="sha384-4oEJ1WQ36fRu6m4gNDOZykKE7vBb+Hjb3SCrpK6fLUEbw3n0K5IP+eEAOgXXLN6B" crossorigin="anonymous"></script>
+  <script src="../../dashboard-plus-grid.js" integrity="sha384-ITjoiUh7aK5NGEBZY0svJLR/sILH5cbymjcFTR+QNQ6hft+3T571mJioynSMKNNT" crossorigin="anonymous"></script>

  <script>
    // Mapbox token resolution — the A3 ladder, in precedence order:
--- a/public/doxa-maps/dashboard-plus-grid/dashboard-plus-grid/index.html
+++ b/public/doxa-maps/dashboard-plus-grid/dashboard-plus-grid/index.html
@ -40,7 +40,7 @@

  <script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
  <!-- Bundle IIFE — registers the <dashboard-plus-grid> custom element. -->
-  <script src="../dashboard-plus-grid.js" integrity="sha384-4oEJ1WQ36fRu6m4gNDOZykKE7vBb+Hjb3SCrpK6fLUEbw3n0K5IP+eEAOgXXLN6B" crossorigin="anonymous"></script>
+  <script src="../dashboard-plus-grid.js" integrity="sha384-ITjoiUh7aK5NGEBZY0svJLR/sILH5cbymjcFTR+QNQ6hft+3T571mJioynSMKNNT" crossorigin="anonymous"></script>

  <script>
    // Mapbox token resolution — the A3 ladder, in precedence order:
--- a/public/doxa-maps/index.html
+++ b/public/doxa-maps/index.html
--- a/public/doxa-maps/manifest.json
+++ b/public/doxa-maps/manifest.json
@ -193,7 +193,7 @@
      "bundle": "dashboard-plus-grid",
      "scriptUrl": "./dashboard-plus-grid/dashboard-plus-grid.js",
      "output": "doxa-maps/dashboard-plus-grid/dashboard-plus-grid.js",
-      "integrity": "sha384-4oEJ1WQ36fRu6m4gNDOZykKE7vBb+Hjb3SCrpK6fLUEbw3n0K5IP+eEAOgXXLN6B",
+      "integrity": "sha384-ITjoiUh7aK5NGEBZY0svJLR/sILH5cbymjcFTR+QNQ6hft+3T571mJioynSMKNNT",
      "elements": [
        "dashboard-plus-grid"
      ],
@ -213,7 +213,7 @@
          "scriptUrl": "./dashboard-plus-grid/dashboard-plus-grid.js",
          "embed": {
            "iframe": "<iframe src=\"./dashboard-plus-grid/dashboard-plus-grid/index.html?utm_source=YOUR_SOURCE\" width=\"100%\" height=\"600\" style=\"border:none;border-radius:12px;\" allowfullscreen></iframe>",
-            "script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./dashboard-plus-grid/dashboard-plus-grid.js\" integrity=\"sha384-4oEJ1WQ36fRu6m4gNDOZykKE7vBb+Hjb3SCrpK6fLUEbw3n0K5IP+eEAOgXXLN6B\" crossorigin=\"anonymous\"></script>\n<dashboard-plus-grid profile-config='{\"profile\":\"dashboard-plus-grid\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></dashboard-plus-grid>"
+            "script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./dashboard-plus-grid/dashboard-plus-grid.js\" integrity=\"sha384-ITjoiUh7aK5NGEBZY0svJLR/sILH5cbymjcFTR+QNQ6hft+3T571mJioynSMKNNT\" crossorigin=\"anonymous\"></script>\n<dashboard-plus-grid profile-config='{\"profile\":\"dashboard-plus-grid\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></dashboard-plus-grid>"
          },
          "instances": [
            {
@ -878,7 +878,7 @@
      "bundle": "research-dashboard",
      "scriptUrl": "./research-dashboard/research-dashboard.js",
      "output": "doxa-maps/research-dashboard/research-dashboard.js",
-      "integrity": "sha384-sKkGeAjsGUgLLaWb4UtIBEaBY+/9/oPiURNUuHNEJDvsNuwvexY8SQag1QsOPJQO",
+      "integrity": "sha384-ze4tzWrCfxwEg4eEGGOzk7qOq/mRduu7qs2+bJMUK9rZ4FX8kYQPY3AwqXt5lglT",
      "elements": [
        "research-dashboard-map"
      ],
@ -894,7 +894,7 @@
          "scriptUrl": "./research-dashboard/research-dashboard.js",
          "embed": {
            "iframe": "<iframe src=\"./research-dashboard/research-dashboard/index.html?utm_source=YOUR_SOURCE\" width=\"100%\" height=\"600\" style=\"border:none;border-radius:12px;\" allowfullscreen></iframe>",
-            "script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./research-dashboard/research-dashboard.js\" integrity=\"sha384-sKkGeAjsGUgLLaWb4UtIBEaBY+/9/oPiURNUuHNEJDvsNuwvexY8SQag1QsOPJQO\" crossorigin=\"anonymous\"></script>\n<research-dashboard-map profile-config='{\"profile\":\"research-dashboard\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></research-dashboard-map>"
+            "script": "<script>window.MAP_APP_API_URL=\"https://pray.doxa.life\";</script>\n<script src=\"./research-dashboard/research-dashboard.js\" integrity=\"sha384-ze4tzWrCfxwEg4eEGGOzk7qOq/mRduu7qs2+bJMUK9rZ4FX8kYQPY3AwqXt5lglT\" crossorigin=\"anonymous\"></script>\n<research-dashboard-map profile-config='{\"profile\":\"research-dashboard\",\"tk\":\"YOUR_MAPBOX_TOKEN\",\"utmSource\":\"YOUR_SOURCE\",\"assetsBase\":\"YOUR_TREE_URL/assets\"}'></research-dashboard-map>"
          },
          "bundle": "research-dashboard"
        }
--- a/public/doxa-maps/research-dashboard/research-dashboard.js
+++ b/public/doxa-maps/research-dashboard/research-dashboard.js
--- a/public/doxa-maps/research-dashboard/research-dashboard/index.html
+++ b/public/doxa-maps/research-dashboard/research-dashboard/index.html
@ -29,7 +29,7 @@

  <script>window.MAP_APP_API_URL = "https://pray.doxa.life";</script>
  <!-- Bundle IIFE — registers the <research-dashboard-map> custom element. -->
-  <script src="../research-dashboard.js" integrity="sha384-sKkGeAjsGUgLLaWb4UtIBEaBY+/9/oPiURNUuHNEJDvsNuwvexY8SQag1QsOPJQO" crossorigin="anonymous"></script>
+  <script src="../research-dashboard.js" integrity="sha384-ze4tzWrCfxwEg4eEGGOzk7qOq/mRduu7qs2+bJMUK9rZ4FX8kYQPY3AwqXt5lglT" crossorigin="anonymous"></script>

  <script>
    // Mapbox token resolution — the A3 ladder, in precedence order: