Affichage des départements par région
This commit is contained in:
parent
44c6f1917b
commit
6d9452e9bf
GPG Key ID:
3A75C55819C8CF85
|
|
@ -12,7 +12,7 @@ import Switch from '@mui/material/Switch'
|
|||
import * as Highcharts from 'highcharts'
|
||||
import highchartsItem from 'highcharts/modules/item-series'
|
||||
import HighchartsReact from 'highcharts-react-official'
|
||||
import {useEffect, useState} from "react"
|
||||
import {useEffect, useMemo, useState} from "react"
|
||||
import {GeoJSON, MapContainer, Popup, TileLayer, useMap} from "react-leaflet"
|
||||
|
||||
import 'leaflet/dist/leaflet.css'
|
||||
|
|
@ -167,7 +167,7 @@ function RegionGeoJSON({resultats_region, listes, blocs, nuances, grouperParBloc
|
|||
|
||||
return <GeoJSON
|
||||
key={resultats_region.region.code_insee}
|
||||
data={{'type': "Feature", 'properties': resultats_region, 'geometry': resultats_region.geometry}}
|
||||
data={{'type': "Feature", 'geometry': resultats_region.geometry}}
|
||||
style={{fillColor: couleur, fillOpacity: 0.5, color: 'white'}}>
|
||||
<Popup>
|
||||
<strong><a href={`/elections/europeennes/2024/region/${resultats_region.region.code_insee}/`}>{resultats_region.region.nom}</a></strong>
|
||||
|
|
@ -179,27 +179,106 @@ function RegionGeoJSON({resultats_region, listes, blocs, nuances, grouperParBloc
|
|||
</GeoJSON>
|
||||
}
|
||||
|
||||
function ContenuCarte({typeResultats, resultats, listes, blocs, nuances, grouperParBloc = false}) {
|
||||
const [regions, setRegions] = useState([])
|
||||
|
||||
useEffect(() => {
|
||||
if (!resultats || !resultats.france || !resultats.france.regions)
|
||||
return
|
||||
|
||||
setRegions(regions => [])
|
||||
|
||||
resultats.france.regions.forEach(region_code => {
|
||||
fetch(`/data/resultats/europeennes2024/regions/${region_code}.json`).then(response => response.json())
|
||||
.then(region => setRegions(regions => [...regions, region]))
|
||||
function DepartementGeoJSON({resultats_departement, listes, blocs, nuances, grouperParBloc = false}) {
|
||||
const voix_listes = resultats_departement?.voix_listes ?? {}
|
||||
const listes_triees = listes.toSorted((l1, l2) => {
|
||||
return (voix_listes[l2.numero] || 0) - (voix_listes[l1.numero] || 0)
|
||||
})
|
||||
}, [typeResultats, resultats])
|
||||
|
||||
const voixParBloc = {}
|
||||
const voixParNuance = {}
|
||||
for (let bloc of blocs) {
|
||||
voixParBloc[bloc.nom] = 0
|
||||
}
|
||||
for (let nuance of nuances) {
|
||||
voixParNuance[nuance.code] = 0
|
||||
}
|
||||
|
||||
for (let liste of listes) {
|
||||
voixParBloc[liste.bloc] += resultats_departement.voix_listes[liste.numero] || 0
|
||||
voixParNuance[liste.nuance] += resultats_departement.voix_listes[liste.numero] || 0
|
||||
}
|
||||
|
||||
let couleur = 'grey'
|
||||
if (grouperParBloc) {
|
||||
let maxVoix = 0
|
||||
for (let bloc of blocs) {
|
||||
if (voixParBloc[bloc.nom] > maxVoix) {
|
||||
maxVoix = voixParBloc[bloc.nom]
|
||||
couleur = bloc.couleur
|
||||
}
|
||||
}
|
||||
}
|
||||
else {
|
||||
let maxVoix = 0
|
||||
for (let nuance of nuances) {
|
||||
if (voixParNuance[nuance.code] > maxVoix) {
|
||||
maxVoix = voixParNuance[nuance.code]
|
||||
couleur = nuance.couleur
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
console.log(resultats_departement.departement.code_insee, resultats_departement.geometry)
|
||||
|
||||
return <GeoJSON
|
||||
key={resultats_departement.departement.code_insee}
|
||||
data={{'type': "Feature", 'geometry': resultats_departement.geometry}}
|
||||
style={{fillColor: couleur, fillOpacity: 0.5, color: 'white'}}>
|
||||
<Popup>
|
||||
<strong><a href={`/elections/europeennes/2024/departement/${resultats_departement.departement.code_insee}/`}>{resultats_departement.departement.nom}</a></strong>
|
||||
<ul>
|
||||
{listes_triees.slice(0, 5).map(liste =>
|
||||
<li key={liste.numero}>{liste.nom} : {voix_listes[liste.numero]} ({(100 * voix_listes[liste.numero] / resultats_departement.exprimes).toFixed(2)} %)</li>)}
|
||||
</ul>
|
||||
</Popup>
|
||||
</GeoJSON>
|
||||
}
|
||||
|
||||
function ContenuCarte({typeResultats, resultats, listes, blocs, nuances, grouperParBloc = false}) {
|
||||
const map = useMap()
|
||||
|
||||
const [resultatsZones, setResultatsZones] = useState([])
|
||||
|
||||
const [typeZone, zones] = useMemo(() => {
|
||||
if (typeResultats === "france") {
|
||||
return ["regions", resultats?.france?.regions ?? []]
|
||||
}
|
||||
else if (typeResultats === "regions") {
|
||||
return ["departements", resultats?.region?.departements ?? []]
|
||||
}
|
||||
}, [typeResultats, resultats])
|
||||
|
||||
useEffect(() => {
|
||||
if (!zones)
|
||||
return
|
||||
|
||||
setResultatsZones(resultatsZones => [])
|
||||
|
||||
zones.forEach(zone_id => {
|
||||
fetch(`/data/resultats/europeennes2024/${typeZone}/${zone_id}.json`).then(response => response.json())
|
||||
.then(resultatsZone => setResultatsZones(resultatsZones => [...resultatsZones, resultatsZone]))
|
||||
})
|
||||
}, [typeZone, zones, resultats])
|
||||
|
||||
if (typeZone === "regions") {
|
||||
return <>
|
||||
{regions.map(region => <RegionGeoJSON key={region.region.code_insee} resultats_region={region} listes={listes} blocs={blocs} nuances={nuances} grouperParBloc={grouperParBloc} />)}
|
||||
{resultatsZones.filter(resultatsZone => resultatsZone.geometry['type']).map(resultatsZone =>
|
||||
<RegionGeoJSON key={resultatsZone.region.code_insee}
|
||||
resultats_region={resultatsZone} listes={listes} blocs={blocs} nuances={nuances}
|
||||
grouperParBloc={grouperParBloc}/>)}
|
||||
</>
|
||||
}
|
||||
else if (typeZone === "departements") {
|
||||
return <>
|
||||
{resultatsZones.filter(resultatsZone => resultatsZone.geometry['type']).map(resultatsZone =>
|
||||
<DepartementGeoJSON key={resultatsZone.departement.code_insee}
|
||||
resultats_departement={resultatsZone} listes={listes} blocs={blocs} nuances={nuances}
|
||||
grouperParBloc={grouperParBloc}/>)}
|
||||
</>
|
||||
}
|
||||
}
|
||||
|
||||
function Carte({typeResultats, resultats, listes, blocs, nuances, grouperParBloc = false}) {
|
||||
const center = [46.603354, 1.888334]
|
||||
|
|
@ -280,8 +359,8 @@ export default function Election2024({typeResultats = "france"}) {
|
|||
}
|
||||
|
||||
for (let liste of listes) {
|
||||
parBloc[liste.bloc] += resultats.voix_listes[liste.numero] || 0
|
||||
parNuance[liste.nuance] += resultats.voix_listes[liste.numero] || 0
|
||||
parBloc[liste.bloc] += resultats?.voix_listes[liste.numero] ?? 0
|
||||
parNuance[liste.nuance] += resultats?.voix_listes[liste.numero] ?? 0
|
||||
}
|
||||
|
||||
setVoixParBloc(parBloc)
|
||||
|
|
@ -314,7 +393,7 @@ export default function Election2024({typeResultats = "france"}) {
|
|||
let siegesAffectes = 0
|
||||
let totalVoix = resultats.exprimes
|
||||
for (let liste of listes) {
|
||||
const voix = resultats.voix_listes[liste.numero] || 0
|
||||
const voix = resultats?.voix_listes[liste.numero] ?? 0
|
||||
if (voix / resultats.exprimes < 0.05 && !retirerSeuil) {
|
||||
// Barre des 5 % non franchie
|
||||
totalVoix -= voix
|
||||
|
|
@ -329,7 +408,7 @@ export default function Election2024({typeResultats = "france"}) {
|
|||
return
|
||||
|
||||
for (let liste of listesElues) {
|
||||
const voix = resultats.voix_listes[liste.numero] || 0
|
||||
const voix = resultats?.voix_listes[liste.numero] ?? 0
|
||||
sieges[liste.numero] = Math.floor(MAX_SIEGES * voix / totalVoix)
|
||||
siegesAffectes += sieges[liste.numero]
|
||||
}
|
||||
|
|
@ -340,7 +419,7 @@ export default function Election2024({typeResultats = "france"}) {
|
|||
let listeElue = null
|
||||
for (let liste of listesElues) {
|
||||
if (sieges[liste.numero] < MAX_SIEGES) {
|
||||
const voix = resultats.voix_listes[liste.numero] || 0
|
||||
const voix = resultats?.voix_listes[liste.numero] ?? 0
|
||||
const moyenne = voix / (sieges[liste.numero] + 1)
|
||||
if (moyenne > maxMoyenne) {
|
||||
maxMoyenne = moyenne
|
||||
|
|
|
|||
Loading…
Reference in New Issue