diff --git a/package-lock.json b/package-lock.json index b44ecef..91ed201 100644 --- a/package-lock.json +++ b/package-lock.json @@ -25,15 +25,13 @@ "@types/node": "^12.19.15", "@types/react": "^18.0.18", "@types/react-dom": "^18.0.6", - "@types/react-leaflet": "^2.8.2", "@types/react-router": "^5.1.11", "@types/react-router-dom": "^5.1.7", "cordova-plugin-geolocation": "^4.1.0", "ionicons": "^6.0.3", - "leaflet": "^1.8.0", + "pigeon-maps": "^0.21.0", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-leaflet": "^4.0.2", "react-router": "^6.3.0", "react-router-dom": "^6.3.0", "react-scripts": "^5.0.0", @@ -3147,16 +3145,6 @@ "prettier": ">=2.3" } }, - "node_modules/@react-leaflet/core": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/@react-leaflet/core/-/core-2.0.1.tgz", - "integrity": "sha512-XGmx01DovDt0IWsW4tqeuSYifpY19aUn9NYCqTBI3KNtjbCjj0pfiWa7krNsnJ6l2oQbv4Nt0/BabLbIvT4ocA==", - "peerDependencies": { - "leaflet": "^1.8.0", - "react": "^18.0.0", - "react-dom": "^18.0.0" - } - }, "node_modules/@rollup/plugin-babel": { "version": "5.3.1", "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz", @@ -4004,11 +3992,6 @@ "@types/node": "*" } }, - "node_modules/@types/geojson": { - "version": "7946.0.10", - "resolved": "https://registry.npmjs.org/@types/geojson/-/geojson-7946.0.10.tgz", - "integrity": "sha512-Nmh0K3iWQJzniTuPRcJn5hxXkfB1T1pgB89SBig5PlJQU5yocazeu4jATJlaA0GYFKWMqDdvYemoSnF2pXgLVA==" - }, "node_modules/@types/graceful-fs": { "version": "4.1.5", "resolved": "https://registry.npmjs.org/@types/graceful-fs/-/graceful-fs-4.1.5.tgz", @@ -4112,14 +4095,6 @@ "resolved": "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz", "integrity": "sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==" }, - "node_modules/@types/leaflet": { - "version": "1.7.11", - "resolved": "https://registry.npmjs.org/@types/leaflet/-/leaflet-1.7.11.tgz", - "integrity": "sha512-VwAYom2pfIAf/pLj1VR5aLltd4tOtHyvfaJlNYCoejzP2nu52PrMi1ehsLRMUS+bgafmIIKBV1cMfKeS+uJ0Vg==", - "dependencies": { - "@types/geojson": "*" - } - }, "node_modules/@types/mime": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/@types/mime/-/mime-3.0.1.tgz", @@ -4188,15 +4163,6 @@ "@types/react": "*" } }, - "node_modules/@types/react-leaflet": { - "version": "2.8.2", - "resolved": "https://registry.npmjs.org/@types/react-leaflet/-/react-leaflet-2.8.2.tgz", - "integrity": "sha512-Iel8Vd1bSCD38Yhiqcmm/+9hjPEdd39LFE3tBMbOytq3QAQsC3LDrbo6ifoh8JbpqPbCsQPo9Wx5OELHixEShg==", - "dependencies": { - "@types/leaflet": "*", - "@types/react": "*" - } - }, "node_modules/@types/react-router": { "version": "5.1.18", "resolved": "https://registry.npmjs.org/@types/react-router/-/react-router-5.1.18.tgz", @@ -11253,11 +11219,6 @@ "language-subtag-registry": "~0.3.2" } }, - "node_modules/leaflet": { - "version": "1.8.0", - "resolved": "https://registry.npmjs.org/leaflet/-/leaflet-1.8.0.tgz", - "integrity": "sha512-gwhMjFCQiYs3x/Sf+d49f10ERXaEFCPr+nVTryhAW8DWbMGqJqt9G4XuIaHmFW08zYvhgdzqXGr8AlW8v8dQkA==" - }, "node_modules/leven": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/leven/-/leven-3.1.0.tgz", @@ -12576,6 +12537,14 @@ "node": ">=0.10.0" } }, + "node_modules/pigeon-maps": { + "version": "0.21.0", + "resolved": "https://registry.npmjs.org/pigeon-maps/-/pigeon-maps-0.21.0.tgz", + "integrity": "sha512-p3GaGday5nmufHVGZW/36LnSXfYVh6qfzYisqcC87nqFr0eXIKkqQcDuPP9g4F1OXL1JeJe4x6JEnAE9HB+zWQ==", + "peerDependencies": { + "react": "*" + } + }, "node_modules/pirates": { "version": "4.0.5", "resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.5.tgz", @@ -14244,19 +14213,6 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" }, - "node_modules/react-leaflet": { - "version": "4.0.2", - "resolved": "https://registry.npmjs.org/react-leaflet/-/react-leaflet-4.0.2.tgz", - "integrity": "sha512-pDyIf50Ek/LZ0p4Qxw2D9LMOx+LytQs2R+MY3mhTUPGzubrpP4QAgbCv2qc0L9y0qVRgx7dHavWuPFkc/WCJCw==", - "dependencies": { - "@react-leaflet/core": "^2.0.1" - }, - "peerDependencies": { - "leaflet": "^1.8.0", - "react": "^18.0.0", - "react-dom": "^18.0.0" - } - }, "node_modules/react-refresh": { "version": "0.11.0", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz", @@ -20127,12 +20083,6 @@ "prettier": ">=2.3" } }, - "@react-leaflet/core": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/@react-leaflet/core/-/core-2.0.1.tgz", - "integrity": "sha512-XGmx01DovDt0IWsW4tqeuSYifpY19aUn9NYCqTBI3KNtjbCjj0pfiWa7krNsnJ6l2oQbv4Nt0/BabLbIvT4ocA==", - "requires": {} - }, "@rollup/plugin-babel": { "version": "5.3.1", "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz", @@ -20769,11 +20719,6 @@ "@types/node": "*" } }, - "@types/geojson": { - "version": "7946.0.10", - "resolved": "https://registry.npmjs.org/@types/geojson/-/geojson-7946.0.10.tgz", - "integrity": "sha512-Nmh0K3iWQJzniTuPRcJn5hxXkfB1T1pgB89SBig5PlJQU5yocazeu4jATJlaA0GYFKWMqDdvYemoSnF2pXgLVA==" - }, "@types/graceful-fs": { "version": "4.1.5", "resolved": "https://registry.npmjs.org/@types/graceful-fs/-/graceful-fs-4.1.5.tgz", @@ -20873,14 +20818,6 @@ "resolved": "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz", "integrity": "sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==" }, - "@types/leaflet": { - "version": "1.7.11", - "resolved": "https://registry.npmjs.org/@types/leaflet/-/leaflet-1.7.11.tgz", - "integrity": "sha512-VwAYom2pfIAf/pLj1VR5aLltd4tOtHyvfaJlNYCoejzP2nu52PrMi1ehsLRMUS+bgafmIIKBV1cMfKeS+uJ0Vg==", - "requires": { - "@types/geojson": "*" - } - }, "@types/mime": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/@types/mime/-/mime-3.0.1.tgz", @@ -20949,15 +20886,6 @@ "@types/react": "*" } }, - "@types/react-leaflet": { - "version": "2.8.2", - "resolved": "https://registry.npmjs.org/@types/react-leaflet/-/react-leaflet-2.8.2.tgz", - "integrity": "sha512-Iel8Vd1bSCD38Yhiqcmm/+9hjPEdd39LFE3tBMbOytq3QAQsC3LDrbo6ifoh8JbpqPbCsQPo9Wx5OELHixEShg==", - "requires": { - "@types/leaflet": "*", - "@types/react": "*" - } - }, "@types/react-router": { "version": "5.1.18", "resolved": "https://registry.npmjs.org/@types/react-router/-/react-router-5.1.18.tgz", @@ -26142,11 +26070,6 @@ "language-subtag-registry": "~0.3.2" } }, - "leaflet": { - "version": "1.8.0", - "resolved": "https://registry.npmjs.org/leaflet/-/leaflet-1.8.0.tgz", - "integrity": "sha512-gwhMjFCQiYs3x/Sf+d49f10ERXaEFCPr+nVTryhAW8DWbMGqJqt9G4XuIaHmFW08zYvhgdzqXGr8AlW8v8dQkA==" - }, "leven": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/leven/-/leven-3.1.0.tgz", @@ -27109,6 +27032,12 @@ "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz", "integrity": "sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==" }, + "pigeon-maps": { + "version": "0.21.0", + "resolved": "https://registry.npmjs.org/pigeon-maps/-/pigeon-maps-0.21.0.tgz", + "integrity": "sha512-p3GaGday5nmufHVGZW/36LnSXfYVh6qfzYisqcC87nqFr0eXIKkqQcDuPP9g4F1OXL1JeJe4x6JEnAE9HB+zWQ==", + "requires": {} + }, "pirates": { "version": "4.0.5", "resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.5.tgz", @@ -28138,14 +28067,6 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" }, - "react-leaflet": { - "version": "4.0.2", - "resolved": "https://registry.npmjs.org/react-leaflet/-/react-leaflet-4.0.2.tgz", - "integrity": "sha512-pDyIf50Ek/LZ0p4Qxw2D9LMOx+LytQs2R+MY3mhTUPGzubrpP4QAgbCv2qc0L9y0qVRgx7dHavWuPFkc/WCJCw==", - "requires": { - "@react-leaflet/core": "^2.0.1" - } - }, "react-refresh": { "version": "0.11.0", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz", diff --git a/package.json b/package.json index 2c92643..18d5654 100644 --- a/package.json +++ b/package.json @@ -21,15 +21,13 @@ "@types/node": "^12.19.15", "@types/react": "^18.0.18", "@types/react-dom": "^18.0.6", - "@types/react-leaflet": "^2.8.2", "@types/react-router": "^5.1.11", "@types/react-router-dom": "^5.1.7", "cordova-plugin-geolocation": "^4.1.0", "ionicons": "^6.0.3", - "leaflet": "^1.8.0", + "pigeon-maps": "^0.21.0", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-leaflet": "^4.0.2", "react-router": "^6.3.0", "react-router-dom": "^6.3.0", "react-scripts": "^5.0.0", diff --git a/src/App.tsx b/src/App.tsx index ae02b69..05a6a90 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -19,8 +19,6 @@ import '@ionic/react/css/display.css'; /* Theme variables */ import './theme/variables.css'; -import './theme/leaflet.css'; - /* Components */ import LiveMap from './components/live-map' diff --git a/src/components/live-map.tsx b/src/components/live-map.tsx index 54d973b..31976fb 100644 --- a/src/components/live-map.tsx +++ b/src/components/live-map.tsx @@ -1,37 +1,26 @@ import react from "react"; import { useState, useEffect } from "react"; -import { MapContainer, TileLayer, Marker, Popup } from "react-leaflet"; -import { useMap } from 'react-leaflet'; +import { Map, Marker } from "pigeon-maps" import { Geolocation } from "@awesome-cordova-plugins/geolocation"; const LiveMap: react.FC = () => { const initialPosition: [number, number] = [44.73574, 6.18981]; const [currentPosition, setCurrentposition] = useState(initialPosition); - const theMap = useMap(); useEffect(()=>{ Geolocation.getCurrentPosition().then((position) => { setCurrentposition([position.coords.latitude, position.coords.longitude]); - theMap.setView([position.coords.latitude, position.coords.longitude], 13); - } + } ); }, []) return ( - - - - - A pretty CSS3 popup.
Easily customizable. -
-
-
- ); + + + + ); }; export default LiveMap; diff --git a/src/theme/leaflet.css b/src/theme/leaflet.css deleted file mode 100644 index 468f57e..0000000 --- a/src/theme/leaflet.css +++ /dev/null @@ -1,4 +0,0 @@ -.leaflet-container { - width: 100%; - height: 100vh; -} \ No newline at end of file