fix: resolve MapLibre worker rendering regression by configuring custom worker and updating geometry type filters
This commit is contained in:
@@ -11,7 +11,7 @@ export class AdminGuard implements CanActivate {
|
||||
throw new UnauthorizedException('Tenant not found in request');
|
||||
}
|
||||
|
||||
if (tenant.plan !== TenantPlan.ENTERPRISE && tenant.role !== TenantRole.ADMIN) {
|
||||
if (tenant.plan !== TenantPlan.ENTERPRISE && tenant.role !== 'ADMIN') {
|
||||
throw new ForbiddenException('Admin access required. Your tenant must have an ENTERPRISE plan or ADMIN clearance.');
|
||||
}
|
||||
|
||||
|
||||
@@ -198,7 +198,7 @@ const MapComponent: React.FC<MapProps> = ({
|
||||
id: 'los-line',
|
||||
type: 'line',
|
||||
source: 'los-source',
|
||||
filter: ['==', '$type', 'LineString'],
|
||||
filter: ['==', ['geometry-type'], 'LineString'],
|
||||
layout: { 'line-cap': 'round', 'line-join': 'round' },
|
||||
paint: {
|
||||
'line-color': '#f59e0b',
|
||||
@@ -211,7 +211,7 @@ const MapComponent: React.FC<MapProps> = ({
|
||||
id: 'los-points',
|
||||
type: 'circle',
|
||||
source: 'los-source',
|
||||
filter: ['==', '$type', 'Point'],
|
||||
filter: ['==', ['geometry-type'], 'Point'],
|
||||
paint: {
|
||||
'circle-radius': 8,
|
||||
'circle-color': [
|
||||
@@ -230,7 +230,7 @@ const MapComponent: React.FC<MapProps> = ({
|
||||
id: 'los-labels',
|
||||
type: 'symbol',
|
||||
source: 'los-source',
|
||||
filter: ['==', '$type', 'Point'],
|
||||
filter: ['==', ['geometry-type'], 'Point'],
|
||||
layout: {
|
||||
'text-field': ['get', 'label'],
|
||||
'text-size': 12,
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import React, { useEffect, useState } from 'react'
|
||||
import ReactDOM from 'react-dom/client'
|
||||
import maplibregl from 'maplibre-gl'
|
||||
import maplibregl from './utils/maplibreWorker'
|
||||
import App from './App.tsx'
|
||||
import CompareView from './pages/CompareView'
|
||||
import IntelligenceDashboard from './pages/IntelligenceDashboard'
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,10 @@
|
||||
import maplibregl from 'maplibre-gl';
|
||||
import workerUrl from 'maplibre-gl/dist/maplibre-gl-csp-worker.js?url';
|
||||
|
||||
// MapLibre 5 serializes its embedded worker from functions. Vite's class-field
|
||||
// transform injects __publicField outside those functions, leaving GeoJSON
|
||||
// workers with an undefined helper. Serve the matching standalone worker as an
|
||||
// untransformed asset in both development and production, before any map exists.
|
||||
maplibregl.setWorkerUrl(workerUrl);
|
||||
|
||||
export default maplibregl;
|
||||
@@ -0,0 +1,48 @@
|
||||
# GeoJSON overlay rendering regression
|
||||
|
||||
The tactical calculations return geometry, but MapLibre's GeoJSON worker fails
|
||||
with `__publicField is not defined`. HTML markers and vector basemap tiles still
|
||||
render, so the UI appears functional while all GeoJSON overlays remain invisible.
|
||||
|
||||
## Cause
|
||||
|
||||
Commit `0bf1382` changed Vite 8.0.1 to 6.4.3 (and the React plugin to 4.7.0).
|
||||
The current optimized MapLibre 5.20.2 bundle imports `__publicField` outside the
|
||||
functions that MapLibre serializes into its embedded worker. The GeoJSON indexing
|
||||
code references that helper inside the worker, where it does not exist.
|
||||
Changing geometry filters, opacity, layer order, or camera bounds cannot repair
|
||||
this worker failure.
|
||||
|
||||
## Fix
|
||||
|
||||
`src/utils/maplibreWorker.ts` loads the installed MapLibre 5 standalone CSP worker
|
||||
using Vite's asset URL import and calls `setWorkerUrl` before React creates maps.
|
||||
`src/main.tsx` imports this configured MapLibre instance. Other components share
|
||||
the same underlying MapLibre module. No API or geometry calculation change is
|
||||
required.
|
||||
|
||||
The `?url` import is intentional for this self-contained MapLibre 5 worker: it
|
||||
preserves the vendor file without transpilation. Revisit the worker entry point
|
||||
if upgrading MapLibre to a new major version.
|
||||
|
||||
## Verification (2026-09-24)
|
||||
|
||||
- Reproduced the missing overlays on the official tactical site, and confirmed
|
||||
its Isochrone API returned three valid Polygon features.
|
||||
- A minimal map with an empty base style and a fixed line/polygon reproduced the
|
||||
same failure: zero source/rendered features and `__publicField is not defined`.
|
||||
- With the standalone worker, that same map visibly drew both geometries, with
|
||||
eight tile-level source/rendered feature entries and no worker error.
|
||||
- Tested the modified tactical UI locally, proxying API requests to the official
|
||||
service: terrain overlays, the 10.9 km² / 14% viewshed, and colored Isochrone
|
||||
regions rendered. Temporary diagnostic geometry was removed afterward.
|
||||
- `npm run build` succeeds. The emitted standalone worker is byte-identical to
|
||||
the installed vendor worker.
|
||||
|
||||
## Deployment
|
||||
|
||||
Deploy `apps/web/src/main.tsx` and `apps/web/src/utils/maplibreWorker.ts` together.
|
||||
The observed official site serves Vite development modules; restart its web
|
||||
service and reload the browser after deploying. For a production build, deploy
|
||||
the complete `dist` output, including the emitted worker asset. The live site
|
||||
has not been changed by this local fix.
|
||||
Reference in New Issue
Block a user