Fix hurricane overlay ordering and map-load guard
Publish Container / publish (push) Successful in 2m52s
Publish Container / publish (push) Successful in 2m52s
- Move renderHurricaneOverlay call to after track layers so position circles render on top of the track line and dots - Add map.loaded() guard to avoid overlay being silently skipped if the map style hasn't finished initializing Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
1 parent
3af4c1df4b
commit
fc93079109
1 file changed
+6
-4
+6
-4
@@ -125,13 +125,13 @@ async function flyToHurricane(storm) {
|
|||||||
|
|
||||||
const map = mapsOverview.map;
|
const map = mapsOverview.map;
|
||||||
if (!map) return;
|
if (!map) return;
|
||||||
|
if (!map.loaded()) await new Promise(resolve => map.once('load', resolve));
|
||||||
|
|
||||||
await renderHurricaneOverlay(map);
|
|
||||||
map.flyTo({ center: [lon, lat], zoom: 4, duration: 900 });
|
map.flyTo({ center: [lon, lat], zoom: 4, duration: 900 });
|
||||||
|
|
||||||
|
const cat = (storm.classification || '').toUpperCase();
|
||||||
|
const label = cat === 'HU' ? 'Hurricane' : cat === 'TS' ? 'Tropical Storm' : 'Tropical Depression';
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
const cat = (storm.classification || '').toUpperCase();
|
|
||||||
const label = cat === 'HU' ? 'Hurricane' : cat === 'TS' ? 'Tropical Storm' : 'Tropical Depression';
|
|
||||||
new maplibregl.Popup({ closeButton: true, maxWidth: '240px' })
|
new maplibregl.Popup({ closeButton: true, maxWidth: '240px' })
|
||||||
.setLngLat([lon, lat])
|
.setLngLat([lon, lat])
|
||||||
.setHTML(`<b>${storm.name || 'Storm'}</b><br>${label}<br>Winds: ${storm.intensity || '--'} mph${storm.movement ? '<br>Moving ' + storm.movement : ''}`)
|
.setHTML(`<b>${storm.name || 'Storm'}</b><br>${label}<br>Winds: ${storm.intensity || '--'} mph${storm.movement ? '<br>Moving ' + storm.movement : ''}`)
|
||||||
@@ -173,7 +173,6 @@ async function flyToHurricane(storm) {
|
|||||||
'circle-stroke-width': 2, 'circle-stroke-color': '#fff',
|
'circle-stroke-width': 2, 'circle-stroke-color': '#fff',
|
||||||
} });
|
} });
|
||||||
|
|
||||||
// Fit map to show full track
|
|
||||||
const allCoords = pts.features.map(f => f.geometry.coordinates);
|
const allCoords = pts.features.map(f => f.geometry.coordinates);
|
||||||
if (allCoords.length > 1) {
|
if (allCoords.length > 1) {
|
||||||
const lons = allCoords.map(c => c[0]);
|
const lons = allCoords.map(c => c[0]);
|
||||||
@@ -199,6 +198,9 @@ async function flyToHurricane(storm) {
|
|||||||
}
|
}
|
||||||
} catch {}
|
} catch {}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Render overlay last so storm circles sit on top of the track layers
|
||||||
|
await renderHurricaneOverlay(map);
|
||||||
}
|
}
|
||||||
|
|
||||||
function renderPrecipChart(h, startIdx) {
|
function renderPrecipChart(h, startIdx) {
|
||||||
|
|||||||
Reference in new issue
Block a user