dancingCycle
/
osm-rvb
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(ui-osm): add dependency react-leaflet-cluster

This commit is contained in:
dancingCycle 2023-09-15 13:59:20 +02:00
parent d5ff9c7a5f
commit 892fd3ff41
3 changed files with 50 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
ui-osm/app/components/map/entities-map.jsx
View File

@ -1,6 +1,7 @@
import React from 'react';
import PropTypes from 'prop-types';
import {MapContainer,Polyline,TileLayer} from 'react-leaflet';
import MarkerClusterGroup from 'react-leaflet-cluster';
/*JS module import (vs cdn or style link)*/
import 'leaflet/dist/leaflet.css'
@ -15,13 +16,6 @@ export default function EntitiesMap({entities}) {
const position = [52.16594, 10.52673];
if ( entities !== undefined && entities !== null && entities.length > 0 ) {
/*return a React element*/
}else{
return (
<>
<p>Loading...</p>
</>
);
}
return (
<>
<MapContainer
@ -38,6 +32,9 @@ export default function EntitiesMap({entities}) {
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
/>
<MarkerClusterGroup
chunkedLoading
>
{
entities.map( function( value, key ) {
if ( value.type === "node"){
@ -65,9 +62,17 @@ export default function EntitiesMap({entities}) {
}
})
}
</MarkerClusterGroup>
</MapContainer>
</>
);
}else{
return (
<>
<p>Loading...</p>
</>
);
}
}
EntitiesMap.propTypes = {
entities: PropTypes.array

37
ui-osm/package-lock.json generated
View File

@ -14,6 +14,7 @@
"react": "18.2.0",
"react-dom": "18.2.0",
"react-leaflet": "4.2.1",
"react-leaflet-cluster": "2.1.0",
"react-router-dom": "6.15.0"
},
"devDependencies": {
@ -4410,6 +4411,14 @@
"resolved": "https://registry.npmjs.org/leaflet/-/leaflet-1.9.4.tgz",
"integrity": "sha512-nxS1ynzJOmOlHp+iL3FyWqK89GtNL8U8rvlMOsQdTTssxZwCXh8N2NB3GDQOL+YR3XnWyZAxwQixURb+FA74PA=="
},
"node_modules/leaflet.markercluster": {
"version": "1.5.3",
"resolved": "https://registry.npmjs.org/leaflet.markercluster/-/leaflet.markercluster-1.5.3.tgz",
"integrity": "sha512-vPTw/Bndq7eQHjLBVlWpnGeLa3t+3zGiuM7fJwCkiMFq+nmRuG3RI3f7f4N4TDX7T4NpbAXpR2+NTRSEGfCSeA==",
"peerDependencies": {
"leaflet": "^1.3.1"
}
},
"node_modules/loader-runner": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-4.3.0.tgz",
@ -5204,6 +5213,20 @@
"react-dom": "^18.0.0"
}
},
"node_modules/react-leaflet-cluster": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/react-leaflet-cluster/-/react-leaflet-cluster-2.1.0.tgz",
"integrity": "sha512-16X7XQpRThQFC4PH4OpXHimGg19ouWmjxjtpxOeBKpvERSvIRqTx7fvhTwkEPNMFTQ8zTfddz6fRTUmUEQul7g==",
"dependencies": {
"leaflet.markercluster": "^1.5.3"
},
"peerDependencies": {
"leaflet": "^1.8.0",
"react": "^18.0.0",
"react-dom": "^18.0.0",
"react-leaflet": "^4.0.0"
}
},
"node_modules/react-router": {
"version": "6.15.0",
"resolved": "https://registry.npmjs.org/react-router/-/react-router-6.15.0.tgz",
@ -9793,6 +9816,12 @@
"resolved": "https://registry.npmjs.org/leaflet/-/leaflet-1.9.4.tgz",
"integrity": "sha512-nxS1ynzJOmOlHp+iL3FyWqK89GtNL8U8rvlMOsQdTTssxZwCXh8N2NB3GDQOL+YR3XnWyZAxwQixURb+FA74PA=="
},
"leaflet.markercluster": {
"version": "1.5.3",
"resolved": "https://registry.npmjs.org/leaflet.markercluster/-/leaflet.markercluster-1.5.3.tgz",
"integrity": "sha512-vPTw/Bndq7eQHjLBVlWpnGeLa3t+3zGiuM7fJwCkiMFq+nmRuG3RI3f7f4N4TDX7T4NpbAXpR2+NTRSEGfCSeA==",
"requires": {}
},
"loader-runner": {
"version": "4.3.0",
"resolved": "https://registry.npmjs.org/loader-runner/-/loader-runner-4.3.0.tgz",
@ -10381,6 +10410,14 @@
"@react-leaflet/core": "^2.1.0"
}
},
"react-leaflet-cluster": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/react-leaflet-cluster/-/react-leaflet-cluster-2.1.0.tgz",
"integrity": "sha512-16X7XQpRThQFC4PH4OpXHimGg19ouWmjxjtpxOeBKpvERSvIRqTx7fvhTwkEPNMFTQ8zTfddz6fRTUmUEQul7g==",
"requires": {
"leaflet.markercluster": "^1.5.3"
}
},
"react-router": {
"version": "6.15.0",
"resolved": "https://registry.npmjs.org/react-router/-/react-router-6.15.0.tgz",

1
ui-osm/package.json
View File

@ -36,6 +36,7 @@
"react": "18.2.0",
"react-dom": "18.2.0",
"react-leaflet": "4.2.1",
"react-leaflet-cluster": "2.1.0",
"react-router-dom": "6.15.0"
}
}