b2f441b075
The region fills did not paint under MapLibre, and three ticks of
instrumenting addLayer() found nothing because the failure never travels
through addLayer's return path. Listening to the map's own `error` EVENT --
the only place it surfaces -- gave it in one run:
layers.regions-fill.paint.fill-emissive-strength: unknown property
layers.regions-border.paint.line-emissive-strength: unknown property
*-emissive-strength is a Mapbox GL v3 lighting property. MapLibre rejects a
layer whose paint carries an unknown property and DROPS THE WHOLE LAYER:
addLayer() accepts the call, emits an error event, and silently omits the
layer. getLayer() then returns undefined and the map renders without it, so
it reads as "the fills do not paint" rather than as a failure.
★ THE REPO ALREADY KNEW THIS, FOR CIRCLES ONLY. useMapProvider.emissivePaint()
exists and its own docstring says "the whole layer is dropped -> invisible
pins" -- but it was hardcoded to 'circle', while the fill, line and
clustering layers still wrote the literal and kept being dropped for exactly
the documented reason. Generalised to emissivePaint(map, kind) and applied
at all five literal sites: useMapLayers x3, useCountryOutline,
useMapClustering. One helper, one rule, no sixth copy.
A second defect was hiding behind the first: regions-border still declared
'source-layer' on the geojson source ("Source layer country_boundaries does
not exist on source"), which only became visible once the paint error
stopped masking it. Fixed the same way as regions-fill.
MEASURED on the built tree: 0 error events, both layers present, and the
screenshot shows the WAGF fills painting under MapLibre -- green, blue,
purple, red, orange -- matching the Mapbox control, which is itself
re-shot and unchanged. Provider sweep 15/17 (the 2 render no map at all),
gates:pre 0, gates:post 17/18 with only the pre-existing
verify/tables-complete failure.
82 lines
4 KiB
JavaScript
82 lines
4 KiB
JavaScript
/**
|
|
* useMapProvider.js — resolve the active map engine ("provider").
|
|
*
|
|
* Resolution order (first defined wins) — matches resolveMapProvider below EXACTLY:
|
|
* 1. profile-config `provider` — per-map, set in the profile-config JSON
|
|
* 2. ?provider= in the page URL — read here directly, so any generated leaf page can be
|
|
* flipped from the URL without the host doing anything
|
|
* 3. window.MAP_PROVIDER — host global, for a host that sets it programmatically
|
|
* 4. 'mapbox' — default; existing behaviour, never regresses
|
|
*
|
|
* Valid values: 'mapbox' | 'maplibre'. Anything else falls back to the default.
|
|
*
|
|
* ★ This header previously listed only THREE rungs, omitting ?provider= and numbering
|
|
* window.MAP_PROVIDER as step 2 — it described a ladder the function does not implement.
|
|
* documentation/how-to.md ("Swap the map engine") carries the correct four-rung order; keep the two
|
|
* in sync, and treat THIS function as the authority when they disagree.
|
|
*/
|
|
|
|
import { inject } from 'vue'
|
|
|
|
export const MAP_PROVIDERS = ['mapbox', 'maplibre']
|
|
export const DEFAULT_PROVIDER = 'mapbox'
|
|
|
|
/** Unwrap a ref/computed to its config object; pass plain objects through. */
|
|
function unwrapConfig(profileConfig) {
|
|
if (profileConfig && typeof profileConfig === 'object'
|
|
&& 'value' in profileConfig && !('provider' in profileConfig) && !('profile' in profileConfig)) {
|
|
return profileConfig.value
|
|
}
|
|
return profileConfig
|
|
}
|
|
|
|
/**
|
|
* Resolve the provider from a profile-config (object or ref) + window fallback.
|
|
* Pure — safe to call outside a Vue setup().
|
|
*/
|
|
export function resolveMapProvider(profileConfig) {
|
|
const cfg = unwrapConfig(profileConfig)
|
|
const fromConfig = cfg?.provider
|
|
const fromUrl = typeof location !== 'undefined'
|
|
? new URLSearchParams(location.search).get('provider') : undefined
|
|
const fromWindow = typeof window !== 'undefined' ? window.MAP_PROVIDER : undefined
|
|
const raw = String(fromConfig || fromUrl || fromWindow || DEFAULT_PROVIDER).toLowerCase().trim()
|
|
return MAP_PROVIDERS.includes(raw) ? raw : DEFAULT_PROVIDER
|
|
}
|
|
|
|
/** Human-readable engine label for a badge / UI. */
|
|
export function providerLabel(provider) {
|
|
return provider === 'maplibre' ? 'MapLibre' : 'Mapbox'
|
|
}
|
|
|
|
/** Convenience for use inside a Vue setup() — injects the provided profileConfig. */
|
|
export function useMapProvider() {
|
|
const profileConfig = inject('profileConfig', null)
|
|
return resolveMapProvider(profileConfig)
|
|
}
|
|
|
|
/** True when this map instance is a Mapbox GL map (vs MapLibre). Per-instance runtime
|
|
* sniff — works even on dual-engine pages where both globals are loaded. */
|
|
export function isMapboxMap(map) {
|
|
return typeof window !== 'undefined' && !!window.mapboxgl && map instanceof window.mapboxgl.Map
|
|
}
|
|
|
|
/** Mapbox-Standard-only lighting paint props, per engine. MapLibre rejects layers whose
|
|
* paint carries unknown properties (the whole layer is dropped → invisible pins), so
|
|
* spread this instead of writing '<kind>-emissive-strength' literally.
|
|
*
|
|
* ★ `kind` EXISTS BECAUSE THE CIRCLE CASE WAS NOT THE ONLY ONE. This helper was hardcoded to
|
|
* 'circle', while fill, line and clustering layers still wrote the literal — so those layers kept
|
|
* being dropped by MapLibre for exactly the reason written above. MEASURED on countries-map by
|
|
* listening to the map's own `error` event, which is the ONLY place it surfaces:
|
|
* layers.regions-fill.paint.fill-emissive-strength: unknown property
|
|
* layers.regions-border.paint.line-emissive-strength: unknown property
|
|
* addLayer() does NOT throw for this — it accepts the call, emits an error event, and silently
|
|
* omits the layer. getLayer() then returns undefined and the map simply renders without it, which
|
|
* is why it read as "the fills do not paint" rather than as an error.
|
|
* @param {object} map the live map instance
|
|
* @param {'circle'|'fill'|'line'} [kind='circle']
|
|
*/
|
|
export function emissivePaint(map, kind = 'circle') {
|
|
return isMapboxMap(map) ? { [`${kind}-emissive-strength`]: 1 } : {}
|
|
}
|