enfance-libre
/
resistants
mirror of https://framagit.org/enfance-libre/resistants
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat: migrate from mapbox to maplibre

proto-module-actu-react
Jalil Arfaoui 2023-05-08 19:45:44 +02:00
parent 3088c8a915
commit af3eccb842
5 changed files with 127 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
index.html
View File

@ -4,9 +4,14 @@
<title>Résistants Enfance Libre</title>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style>
body, html, #root {
height: 100%;
}
</style>
</head>
<body>
<div id="root"></div>
<body >
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>

1
package.json
View File

@ -25,6 +25,7 @@
"@types/react": "^18.0.26",
"@types/react-dom": "^18.0.9",
"@vitejs/plugin-react-swc": "^3.0.0",
"maplibre-gl": "^2.4.0",
"prettier": "^2.8.4",
"prop-types": "^15.8.1",
"typescript": "^4.9.3",

12
src/main.tsx
View File

@ -11,11 +11,17 @@ const renderResistants = (defaultViewMode: ViewMode) => {
);
};
// @ts-ignore
window.Squarespace.onInitialize(Y, function () {
const render = () => {
const defaultViewMode: ViewMode = location.href.includes("resistants")
? "photos"
: "map";
renderResistants(defaultViewMode);
});
};
if ("Squarespace" in window) {
// @ts-ignore
window.Squarespace.onInitialize(Y, render);
} else {
render();
}

12
src/routes/Liste/Map/ResistantsMap.tsx
View File

@ -1,6 +1,8 @@
import React from "react";
import { Resistant } from "../../../Resistant";
import Map, { Marker, NavigationControl, Popup } from "react-map-gl";
import maplibregl from "maplibre-gl";
import "maplibre-gl/dist/maplibre-gl.css";
import { Resistant } from "../../../Resistant";
import { Picto } from "./Picto";
import { PopupContent } from "./PopupContent";
@ -8,8 +10,8 @@ interface Props {
resistants: Resistant[];
}
const accessToken =
"pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4M29iazA2Z2gycXA4N2pmbDZmangifQ.-g_vE53SD2WrJ6tFX7QHmA";
const accessToken = "LiH20XNxcFiTXyT4fgjM";
export const ResistantsMap = ({ resistants }: Props) => {
const [selectedResistant, selectResistant] = React.useState<Resistant | null>(
null
@ -23,8 +25,8 @@ export const ResistantsMap = ({ resistants }: Props) => {
zoom: 5,
}}
style={{ width: "100%", height: 600 }}
mapStyle="mapbox://styles/mapbox/streets-v9"
mapboxAccessToken={accessToken}
mapLib={maplibregl}
mapStyle={`https://api.maptiler.com/maps/streets-v2/style.json?key=${accessToken}`}
>
<NavigationControl />
{resistants.map((r) => (

105
yarn.lock
View File

@ -471,7 +471,7 @@ __metadata:
languageName: node
linkType: hard
"@mapbox/tiny-sdf@npm:^2.0.6":
"@mapbox/tiny-sdf@npm:^2.0.5, @mapbox/tiny-sdf@npm:^2.0.6":
version: 2.0.6
resolution: "@mapbox/tiny-sdf@npm:2.0.6"
checksum: efff5b5a7599aaa995e3c2fd8f2acd071226096458eebb694ffd7258043c46c52b1d09bb3c7343d2126eb257b3cd7d34e6dc7ccaaad7619e6f3e7dd76229a3cd
@ -796,7 +796,7 @@ __metadata:
languageName: node
linkType: hard
"@types/geojson@npm:*":
"@types/geojson@npm:*, @types/geojson@npm:^7946.0.10":
version: 7946.0.10
resolution: "@types/geojson@npm:7946.0.10"
checksum: 12c407c2dc93ecb26c08af533ee732f1506a9b29456616ba7ba1d525df96206c28ddf44a528f6a5415d7d22893e9d967420940a9c095ee5e539c1eba5fefc1f4
@ -812,6 +812,24 @@ __metadata:
languageName: node
linkType: hard
"@types/mapbox__point-geometry@npm:*, @types/mapbox__point-geometry@npm:^0.1.2":
version: 0.1.2
resolution: "@types/mapbox__point-geometry@npm:0.1.2"
checksum: 6e495e5d7e1fae986ab28ee26b5443b9e6ba54ad97c9df051832ab6e2aafc65fe63d4dd80101c922372fa01423b6947fdcfd253f298b3154418c17e7d3a8aa47
languageName: node
linkType: hard
"@types/mapbox__vector-tile@npm:^1.3.0":
version: 1.3.0
resolution: "@types/mapbox__vector-tile@npm:1.3.0"
dependencies:
"@types/geojson": "*"
"@types/mapbox__point-geometry": "*"
"@types/pbf": "*"
checksum: 42fbeba625b6cb3bad47ea79b947aea2a1e32d0620b2f2e17a45cc075ca3be2990697115dd4896d84f11df7c0a9a3533ee76414745b8fd29cb311677b1c6832f
languageName: node
linkType: hard
"@types/parse-json@npm:^4.0.0":
version: 4.0.0
resolution: "@types/parse-json@npm:4.0.0"
@ -819,6 +837,13 @@ __metadata:
languageName: node
linkType: hard
"@types/pbf@npm:*, @types/pbf@npm:^3.0.2":
version: 3.0.2
resolution: "@types/pbf@npm:3.0.2"
checksum: f71ba1facd44a43bd32d4391177099cab69b2ae8381a260382287a4f7f255565d39fa0cf5da27fd2820fc923ead245d50a668824aaa423f908838813802d47f5
languageName: node
linkType: hard
"@types/prop-types@npm:*":
version: 15.7.5
resolution: "@types/prop-types@npm:15.7.5"
@ -1421,6 +1446,17 @@ __metadata:
languageName: node
linkType: hard
"global-prefix@npm:^3.0.0":
version: 3.0.0
resolution: "global-prefix@npm:3.0.0"
dependencies:
ini: ^1.3.5
kind-of: ^6.0.2
which: ^1.3.1
checksum: 8a82fc1d6f22c45484a4e34656cc91bf021a03e03213b0035098d605bfc612d7141f1e14a21097e8a0413b4884afd5b260df0b6a25605ce9d722e11f1df2881d
languageName: node
linkType: hard
"graceful-fs@npm:^4.2.6":
version: 4.2.10
resolution: "graceful-fs@npm:4.2.10"
@ -1568,6 +1604,13 @@ __metadata:
languageName: node
linkType: hard
"ini@npm:^1.3.5":
version: 1.3.8
resolution: "ini@npm:1.3.8"
checksum: dfd98b0ca3a4fc1e323e38a6c8eb8936e31a97a918d3b377649ea15bdb15d481207a0dda1021efbd86b464cae29a0d33c1d7dcaf6c5672bee17fa849bc50a1b3
languageName: node
linkType: hard
"invariant@npm:^2.2.4":
version: 2.2.4
resolution: "invariant@npm:2.2.4"
@ -1649,6 +1692,13 @@ __metadata:
languageName: node
linkType: hard
"kind-of@npm:^6.0.2":
version: 6.0.3
resolution: "kind-of@npm:6.0.3"
checksum: 3ab01e7b1d440b22fe4c31f23d8d38b4d9b91d9f291df683476576493d5dfd2e03848a8b05813dd0c3f0e835bc63f433007ddeceb71f05cb25c45ae1b19c6d3b
languageName: node
linkType: hard
"lines-and-columns@npm:^1.1.6":
version: 1.2.4
resolution: "lines-and-columns@npm:1.2.4"
@ -1736,6 +1786,38 @@ __metadata:
languageName: node
linkType: hard
"maplibre-gl@npm:^2.4.0":
version: 2.4.0
resolution: "maplibre-gl@npm:2.4.0"
dependencies:
"@mapbox/geojson-rewind": ^0.5.2
"@mapbox/jsonlint-lines-primitives": ^2.0.2
"@mapbox/mapbox-gl-supported": ^2.0.1
"@mapbox/point-geometry": ^0.1.0
"@mapbox/tiny-sdf": ^2.0.5
"@mapbox/unitbezier": ^0.0.1
"@mapbox/vector-tile": ^1.3.1
"@mapbox/whoots-js": ^3.1.0
"@types/geojson": ^7946.0.10
"@types/mapbox__point-geometry": ^0.1.2
"@types/mapbox__vector-tile": ^1.3.0
"@types/pbf": ^3.0.2
csscolorparser: ~1.0.3
earcut: ^2.2.4
geojson-vt: ^3.2.1
gl-matrix: ^3.4.3
global-prefix: ^3.0.0
murmurhash-js: ^1.0.0
pbf: ^3.2.1
potpack: ^1.0.2
quickselect: ^2.0.0
supercluster: ^7.1.5
tinyqueue: ^2.0.3
vt-pbf: ^3.1.3
checksum: ee3f422332596616861c243ced39b5b58b9d071487f0de75df49e5140fe04c4a9c112a83eb1e5f82bb34a11e78a0d54c39b62f65ef773f371b06b0b319a5a7a2
languageName: node
linkType: hard
"minimatch@npm:^3.1.1":
version: 3.1.2
resolution: "minimatch@npm:3.1.2"
@ -2035,6 +2117,13 @@ __metadata:
languageName: node
linkType: hard
"potpack@npm:^1.0.2":
version: 1.0.2
resolution: "potpack@npm:1.0.2"
checksum: 9dfdbbce012ce80842249abcdd89e20222eb8ae96beba8d578b7e41e78feefc7e33b5c72d46fb8dd3a1e382cb4da9c34574764d88aa8849ab36f542fd2088b42
languageName: node
linkType: hard
"potpack@npm:^2.0.0":
version: 2.0.0
resolution: "potpack@npm:2.0.0"
@ -2265,6 +2354,7 @@ __metadata:
"@types/react-dom": ^18.0.9
"@vitejs/plugin-react-swc": ^3.0.0
mapbox-gl: ^2.12.1
maplibre-gl: ^2.4.0
prettier: ^2.8.4
prop-types: ^15.8.1
react: ^18.2.0
@ -2721,6 +2811,17 @@ __metadata:
languageName: node
linkType: hard
"which@npm:^1.3.1":
version: 1.3.1
resolution: "which@npm:1.3.1"
dependencies:
isexe: ^2.0.0
bin:
which: ./bin/which
checksum: f2e185c6242244b8426c9df1510e86629192d93c1a986a7d2a591f2c24869e7ffd03d6dac07ca863b2e4c06f59a4cc9916c585b72ee9fa1aa609d0124df15e04
languageName: node
linkType: hard
"which@npm:^2.0.2":
version: 2.0.2
resolution: "which@npm:2.0.2"