Meilleur zoom sur une région
This commit is contained in:
parent
efb5344475
commit
b46a58101b
7
nupes-elections-front/package-lock.json
generated
7
nupes-elections-front/package-lock.json
generated
@ -15,6 +15,7 @@
|
||||
"@testing-library/jest-dom": "^5.17.0",
|
||||
"@testing-library/react": "^13.4.0",
|
||||
"@testing-library/user-event": "^13.5.0",
|
||||
"geojson-bbox": "^0.0.1",
|
||||
"highcharts": "^11.4.3",
|
||||
"highcharts-react-official": "^3.2.1",
|
||||
"leaflet": "^1.9.4",
|
||||
@ -10104,6 +10105,12 @@
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/geojson-bbox": {
|
||||
"version": "0.0.1",
|
||||
"resolved": "https://registry.npmjs.org/geojson-bbox/-/geojson-bbox-0.0.1.tgz",
|
||||
"integrity": "sha512-1ZuQ6SmG8X2c5a4rpiGHbjZuZOhz+Y1uCDyN1Az7552/jBziCIaJe4V1d07I6Ul9k8V8yGi6kisDlvpIjJrZ+Q==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/get-caller-file": {
|
||||
"version": "2.0.5",
|
||||
"resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
|
||||
|
@ -10,6 +10,7 @@
|
||||
"@testing-library/jest-dom": "^5.17.0",
|
||||
"@testing-library/react": "^13.4.0",
|
||||
"@testing-library/user-event": "^13.5.0",
|
||||
"geojson-bbox": "^0.0.1",
|
||||
"highcharts": "^11.4.3",
|
||||
"highcharts-react-official": "^3.2.1",
|
||||
"leaflet": "^1.9.4",
|
||||
|
@ -1,4 +1,5 @@
|
||||
import {useParams} from "react-router-dom"
|
||||
import {MenuItem, Select} from "@mui/material"
|
||||
import FormGroup from '@mui/material/FormGroup'
|
||||
import FormControlLabel from '@mui/material/FormControlLabel'
|
||||
import Table from '@mui/material/Table'
|
||||
@ -15,8 +16,8 @@ import HighchartsReact from 'highcharts-react-official'
|
||||
import {useEffect, useMemo, useState} from "react"
|
||||
import {GeoJSON, MapContainer, Popup, TileLayer, useMap} from "react-leaflet"
|
||||
|
||||
import bbox from 'geojson-bbox'
|
||||
import 'leaflet/dist/leaflet.css'
|
||||
import {MenuItem, Select} from "@mui/material";
|
||||
|
||||
highchartsItem(Highcharts)
|
||||
|
||||
@ -180,21 +181,8 @@ function ZoneGeoJSON({typeResultats, resultatsZone, typeZone, listes, blocs, nua
|
||||
}
|
||||
}
|
||||
|
||||
const map = useMap()
|
||||
function onEachFeature(feature, layer) {
|
||||
if (typeResultats !== "france") {
|
||||
const mapCenter = map.getCenter()
|
||||
const bounds = layer.getBounds()
|
||||
if (mapCenter.lat === 0 && mapCenter.lng === 0)
|
||||
map.fitBounds(bounds)
|
||||
else
|
||||
map.fitBounds(map.getBounds().extend(bounds))
|
||||
}
|
||||
}
|
||||
|
||||
return <GeoJSON
|
||||
data={{'type': "Feature", 'geometry': resultatsZone.geometry}}
|
||||
onEachFeature={onEachFeature}
|
||||
style={{fillColor: couleur, fillOpacity: 0.5, color: 'white', weight: 1}}>
|
||||
<Popup>
|
||||
<strong><a href={`/elections/europeennes/2024/${typeZone}/${idZone}/`}>{nomZone}</a></strong>
|
||||
@ -208,7 +196,6 @@ function ZoneGeoJSON({typeResultats, resultatsZone, typeZone, listes, blocs, nua
|
||||
|
||||
function ContenuCarte({typeResultats, resultats, typeZone, listes, blocs, nuances, grouperParBloc = false}) {
|
||||
const map = useMap()
|
||||
|
||||
const [resultatsZones, setResultatsZones] = useState([])
|
||||
|
||||
const zones = useMemo(() => {
|
||||
@ -234,6 +221,18 @@ function ContenuCarte({typeResultats, resultats, typeZone, listes, blocs, nuance
|
||||
return []
|
||||
}, [typeResultats, resultats, typeZone])
|
||||
|
||||
useEffect(() => {
|
||||
if (typeResultats === "france")
|
||||
return
|
||||
|
||||
const geometry = resultats.geometry
|
||||
if (geometry) {
|
||||
// On centre la carte sur la zone
|
||||
const geometry_bbox = bbox(geometry)
|
||||
map.fitBounds([[geometry_bbox[1], geometry_bbox[0]], [geometry_bbox[3], geometry_bbox[2]]])
|
||||
}
|
||||
}, [typeResultats, resultats, map])
|
||||
|
||||
useEffect(() => {
|
||||
if (!zones)
|
||||
return
|
||||
@ -408,7 +407,7 @@ export default function Election2024() {
|
||||
}
|
||||
setCategoriesVoix(categories)
|
||||
setDataVoix(data)
|
||||
}, [voixParBloc, voixParNuance, grouperParBloc])
|
||||
}, [voixParBloc, voixParNuance, blocs, nuances, grouperParBloc])
|
||||
|
||||
useEffect(() => {
|
||||
if (!resultats['voix_listes'])
|
||||
|
Loading…
Reference in New Issue
Block a user