Fix fitBounds running before elevation chart resizes map
invalidateSize() + requestAnimationFrame ensures Leaflet knows the map's actual dimensions after the elevation chart renders. Also removes unnecessary filter on already-typed coordinates. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
1b9683752f
commit
99a4d7af97
1 changed files with 8 additions and 3 deletions
|
|
@ -63,13 +63,18 @@ function RouteFitter({ coordinates }: { coordinates: [number, number, number][]
|
|||
|
||||
// Coordinates are in [lon, lat, elevation] GeoJSON format
|
||||
const bounds = L.latLngBounds(
|
||||
coordinates.filter((c) => c.length >= 2).map((c) => [c[1]!, c[0]!] as [number, number]),
|
||||
coordinates.map((c) => [c[1]!, c[0]!] as [number, number]),
|
||||
);
|
||||
|
||||
if (bounds.isValid()) {
|
||||
if (!bounds.isValid()) return;
|
||||
|
||||
// Delay fitBounds so the layout has settled (elevation chart may resize the map)
|
||||
const raf = requestAnimationFrame(() => {
|
||||
map.invalidateSize();
|
||||
map.fitBounds(bounds, { padding: [50, 50], maxZoom: 16 });
|
||||
hasFitted.current = true;
|
||||
}
|
||||
});
|
||||
return () => cancelAnimationFrame(raf);
|
||||
}, [coordinates, map]);
|
||||
|
||||
return null;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue