noah/noahspan-flying
1
0
Fork 0
Code Issues 9 Pull Requests Actions Packages Projects Releases 8 Wiki Activity

display multiple kml files on same leaflet map component

Browse Source
This commit is contained in:
Noah Spannbauer
2025-05-12 19:17:02 -05:00
parent 9b633672ae
commit 6f2ca6ccfb
1 changed files with 14 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
app/src/components/logTrackMaps/LogTrackMaps.tsx
View File

@@ -44,22 +44,20 @@ const LogTrackMaps = ({ rowKey, trackUrls }: LogTrackMapsProps) => {
}, [trackUrls]) }, [trackUrls])
return ( return (
<> <MapContainer
<MapContainer center={[45.14489, -93.21019]}
center={[45.14489, -93.21019]} scrollWheelZoom={false}
scrollWheelZoom={false} style={{ height: '500px', width: '100%' }}
style={{ height: '500px', width: '100%' }} zoom={8}
zoom={8} >
> <TileLayer
<TileLayer attribution='&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
attribution='&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors' url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" />
/> {tracks.length > 0 && tracks.map((track) => (
{tracks.length > 0 && tracks.map((track) => ( <ReactLeafletKml kml={track} />
<ReactLeafletKml kml={track} /> ))}
))} </MapContainer>
</MapContainer>
</>
); );
} }