921 lines
38 KiB
HTML
921 lines
38 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="fr">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Vespa velutina — Invasion de France</title>
|
||
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.4.1/chart.umd.min.js"></script>
|
||
<style>
|
||
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Source+Serif+4:ital,wght@0,300;0,400;0,600;1,300&family=IBM+Plex+Mono:wght@400;500&display=swap');
|
||
|
||
:root {
|
||
--bg: #f8f6f1;
|
||
--surface: #ffffff;
|
||
--surface2: #f2efe8;
|
||
--accent: #b8860b;
|
||
--accent2: #c94f1a;
|
||
--text: #1a1a14;
|
||
--muted: #7a7060;
|
||
--verified: #2d7a4a;
|
||
--estimated: #b8860b;
|
||
--projected: #c94f1a;
|
||
--border: #ddd8cc;
|
||
--official: #1a4a8a;
|
||
}
|
||
|
||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||
|
||
body {
|
||
background: var(--bg);
|
||
color: var(--text);
|
||
font-family: 'Source Serif 4', Georgia, serif;
|
||
min-height: 100vh;
|
||
}
|
||
|
||
@media print {
|
||
.no-print { display: none !important; }
|
||
body { background: white; }
|
||
.card, .kpi { break-inside: avoid; }
|
||
}
|
||
|
||
/* HEADER */
|
||
.header {
|
||
background: var(--surface);
|
||
border-bottom: 2px solid var(--accent);
|
||
padding: 32px 48px 24px;
|
||
display: grid;
|
||
grid-template-columns: 1fr auto;
|
||
gap: 16px;
|
||
align-items: end;
|
||
}
|
||
|
||
.header-species {
|
||
font-family: 'IBM Plex Mono', monospace;
|
||
font-size: 11px;
|
||
letter-spacing: 0.12em;
|
||
color: var(--accent);
|
||
text-transform: uppercase;
|
||
margin-bottom: 8px;
|
||
}
|
||
|
||
.header-title {
|
||
font-family: 'Bebas Neue', sans-serif;
|
||
font-size: 58px;
|
||
line-height: 0.92;
|
||
letter-spacing: 0.02em;
|
||
color: var(--text);
|
||
}
|
||
|
||
.header-title span { color: var(--accent); }
|
||
|
||
.header-subtitle {
|
||
margin-top: 10px;
|
||
font-size: 14px;
|
||
font-weight: 300;
|
||
font-style: italic;
|
||
color: var(--muted);
|
||
line-height: 1.5;
|
||
}
|
||
|
||
.header-right {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-end;
|
||
gap: 10px;
|
||
}
|
||
|
||
.badge-year {
|
||
font-family: 'Bebas Neue', sans-serif;
|
||
font-size: 80px;
|
||
line-height: 1;
|
||
color: var(--accent2);
|
||
opacity: 0.15;
|
||
text-align: right;
|
||
}
|
||
|
||
.badge-label {
|
||
font-family: 'IBM Plex Mono', monospace;
|
||
font-size: 10px;
|
||
color: var(--muted);
|
||
letter-spacing: 0.1em;
|
||
}
|
||
|
||
.btn-print {
|
||
font-family: 'IBM Plex Mono', monospace;
|
||
font-size: 10px;
|
||
letter-spacing: 0.08em;
|
||
text-transform: uppercase;
|
||
background: var(--surface2);
|
||
border: 1px solid var(--border);
|
||
color: var(--muted);
|
||
padding: 7px 14px;
|
||
cursor: pointer;
|
||
border-radius: 1px;
|
||
transition: border-color 0.15s, color 0.15s;
|
||
}
|
||
.btn-print:hover { border-color: var(--accent); color: var(--accent); }
|
||
|
||
/* MAIN GRID */
|
||
.main {
|
||
padding: 32px 48px;
|
||
display: grid;
|
||
grid-template-columns: 1fr 1fr;
|
||
gap: 24px;
|
||
}
|
||
|
||
.card {
|
||
background: var(--surface);
|
||
border: 1px solid var(--border);
|
||
border-radius: 2px;
|
||
padding: 24px;
|
||
}
|
||
|
||
.card-full { grid-column: 1 / -1; }
|
||
|
||
.card-title {
|
||
font-family: 'IBM Plex Mono', monospace;
|
||
font-size: 10px;
|
||
letter-spacing: 0.14em;
|
||
text-transform: uppercase;
|
||
color: var(--accent);
|
||
margin-bottom: 4px;
|
||
}
|
||
|
||
.card-heading {
|
||
font-family: 'Bebas Neue', sans-serif;
|
||
font-size: 22px;
|
||
letter-spacing: 0.04em;
|
||
color: var(--text);
|
||
margin-bottom: 16px;
|
||
padding-bottom: 12px;
|
||
border-bottom: 1px solid var(--border);
|
||
}
|
||
|
||
/* CHARTS */
|
||
.chart-wrap { position: relative; height: 280px; }
|
||
.chart-wrap-sm { position: relative; height: 210px; }
|
||
|
||
/* LEGEND */
|
||
.legend { display: flex; gap: 20px; margin-top: 14px; flex-wrap: wrap; }
|
||
|
||
.legend-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 7px;
|
||
font-family: 'IBM Plex Mono', monospace;
|
||
font-size: 10px;
|
||
color: var(--muted);
|
||
letter-spacing: 0.06em;
|
||
}
|
||
|
||
.legend-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
|
||
|
||
.legend-dash {
|
||
width: 20px; height: 2px; flex-shrink: 0;
|
||
background: repeating-linear-gradient(to right, var(--projected) 0, var(--projected) 4px, transparent 4px, transparent 8px);
|
||
}
|
||
|
||
/* MILESTONES */
|
||
.milestones { position: relative; padding-left: 24px; }
|
||
|
||
.milestones::before {
|
||
content: '';
|
||
position: absolute;
|
||
left: 6px; top: 8px; bottom: 8px;
|
||
width: 2px;
|
||
background: linear-gradient(to bottom, var(--accent2), var(--accent), var(--official));
|
||
}
|
||
|
||
.milestone {
|
||
position: relative;
|
||
margin-bottom: 16px;
|
||
opacity: 0;
|
||
transform: translateX(-8px);
|
||
animation: fadeSlide 0.4s ease forwards;
|
||
}
|
||
|
||
.milestone:nth-child(1) { animation-delay: 0.05s; }
|
||
.milestone:nth-child(2) { animation-delay: 0.15s; }
|
||
.milestone:nth-child(3) { animation-delay: 0.25s; }
|
||
.milestone:nth-child(4) { animation-delay: 0.35s; }
|
||
.milestone:nth-child(5) { animation-delay: 0.45s; }
|
||
.milestone:nth-child(6) { animation-delay: 0.55s; }
|
||
.milestone:nth-child(7) { animation-delay: 0.65s; }
|
||
.milestone:nth-child(8) { animation-delay: 0.75s; }
|
||
.milestone:nth-child(9) { animation-delay: 0.85s; }
|
||
|
||
@keyframes fadeSlide { to { opacity: 1; transform: translateX(0); } }
|
||
|
||
.milestone::before {
|
||
content: '';
|
||
position: absolute;
|
||
left: -20px; top: 5px;
|
||
width: 8px; height: 8px;
|
||
border-radius: 50%;
|
||
background: var(--accent);
|
||
border: 2px solid var(--bg);
|
||
}
|
||
|
||
.milestone.est::before { background: var(--estimated); }
|
||
.milestone.projected::before { background: var(--projected); }
|
||
.milestone.official::before { background: var(--official); }
|
||
|
||
.milestone-year {
|
||
font-family: 'Bebas Neue', sans-serif;
|
||
font-size: 18px;
|
||
color: var(--accent);
|
||
line-height: 1;
|
||
}
|
||
|
||
.milestone.est .milestone-year { color: var(--estimated); }
|
||
.milestone.projected .milestone-year { color: var(--projected); }
|
||
.milestone.official .milestone-year { color: var(--official); }
|
||
|
||
.milestone-text { font-size: 12.5px; font-weight: 300; color: var(--text); line-height: 1.4; margin-top: 2px; }
|
||
.milestone-source { font-family: 'IBM Plex Mono', monospace; font-size: 9px; color: var(--muted); margin-top: 3px; }
|
||
|
||
/* KPI CARDS */
|
||
.kpis {
|
||
display: grid;
|
||
grid-template-columns: repeat(5, 1fr);
|
||
gap: 12px;
|
||
grid-column: 1 / -1;
|
||
}
|
||
|
||
.kpi {
|
||
background: var(--surface2);
|
||
border: 1px solid var(--border);
|
||
border-radius: 2px;
|
||
padding: 16px 20px;
|
||
position: relative;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.kpi::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; }
|
||
.kpi.k-verified::before { background: var(--verified); }
|
||
.kpi.k-est::before { background: var(--estimated); }
|
||
.kpi.k-proj::before { background: var(--projected); }
|
||
.kpi.k-official::before { background: var(--official); }
|
||
|
||
.kpi-label {
|
||
font-family: 'IBM Plex Mono', monospace;
|
||
font-size: 9px;
|
||
letter-spacing: 0.12em;
|
||
text-transform: uppercase;
|
||
color: var(--muted);
|
||
margin-bottom: 6px;
|
||
}
|
||
|
||
.kpi-value { font-family: 'Bebas Neue', sans-serif; font-size: 32px; line-height: 1; color: var(--text); }
|
||
.kpi-unit { font-size: 12px; font-weight: 300; color: var(--muted); margin-top: 3px; font-style: italic; }
|
||
|
||
/* ALERT */
|
||
.alert {
|
||
grid-column: 1 / -1;
|
||
background: rgba(201,79,26,0.06);
|
||
border: 1px solid rgba(201,79,26,0.28);
|
||
border-left: 3px solid var(--projected);
|
||
padding: 14px 20px;
|
||
border-radius: 2px;
|
||
display: flex;
|
||
gap: 14px;
|
||
align-items: flex-start;
|
||
}
|
||
|
||
.alert.a-official {
|
||
background: rgba(26,74,138,0.05);
|
||
border: 1px solid rgba(26,74,138,0.22);
|
||
border-left-color: var(--official);
|
||
}
|
||
|
||
.alert-icon { font-size: 20px; flex-shrink: 0; margin-top: 1px; }
|
||
|
||
.alert-body { font-size: 12.5px; font-weight: 300; line-height: 1.55; color: var(--text); }
|
||
.alert-body strong { font-weight: 600; color: var(--projected); }
|
||
.alert.a-official .alert-body strong { color: var(--official); }
|
||
|
||
/* PLAN NATIONAL BANNER */
|
||
.plan-banner {
|
||
grid-column: 1 / -1;
|
||
background: linear-gradient(135deg, #152f5c 0%, #1a4a8a 100%);
|
||
border-radius: 2px;
|
||
padding: 22px 28px;
|
||
display: grid;
|
||
grid-template-columns: auto 1fr auto;
|
||
gap: 22px;
|
||
align-items: center;
|
||
}
|
||
|
||
.plan-logo {
|
||
font-family: 'Bebas Neue', sans-serif;
|
||
font-size: 12px;
|
||
letter-spacing: 0.1em;
|
||
color: rgba(255,255,255,0.4);
|
||
writing-mode: vertical-rl;
|
||
transform: rotate(180deg);
|
||
}
|
||
|
||
.plan-tag {
|
||
font-family: 'IBM Plex Mono', monospace;
|
||
font-size: 9px;
|
||
letter-spacing: 0.12em;
|
||
text-transform: uppercase;
|
||
color: rgba(255,255,255,0.5);
|
||
margin-bottom: 8px;
|
||
}
|
||
|
||
.plan-title {
|
||
font-family: 'Bebas Neue', sans-serif;
|
||
font-size: 26px;
|
||
color: #fff;
|
||
line-height: 1.1;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.plan-title span { color: #f5c842; }
|
||
|
||
.plan-text {
|
||
font-size: 12px;
|
||
font-weight: 300;
|
||
color: rgba(255,255,255,0.78);
|
||
line-height: 1.6;
|
||
}
|
||
|
||
.plan-text strong { color: #f5c842; font-weight: 600; }
|
||
|
||
.plan-kpis { display: flex; flex-direction: column; gap: 12px; align-items: flex-end; }
|
||
|
||
.plan-kpi { text-align: right; }
|
||
.plan-kpi-val { font-family: 'Bebas Neue', sans-serif; font-size: 30px; color: #f5c842; line-height: 1; }
|
||
.plan-kpi-lbl { font-family: 'IBM Plex Mono', monospace; font-size: 8px; color: rgba(255,255,255,0.5); letter-spacing: 0.08em; text-transform: uppercase; }
|
||
|
||
/* IMPACT GRID */
|
||
.impact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 4px; }
|
||
|
||
.impact-item {
|
||
padding: 12px 14px;
|
||
background: var(--surface2);
|
||
border: 1px solid var(--border);
|
||
border-radius: 2px;
|
||
}
|
||
|
||
.impact-val { font-family: 'Bebas Neue', sans-serif; font-size: 30px; line-height: 1; color: var(--text); }
|
||
.impact-label { font-size: 11.5px; font-weight: 300; color: var(--muted); line-height: 1.4; margin-top: 3px; }
|
||
.impact-source { font-family: 'IBM Plex Mono', monospace; font-size: 8.5px; color: rgba(0,0,0,0.25); margin-top: 5px; }
|
||
|
||
/* MAP */
|
||
.map-card {
|
||
grid-column: 1 / -1;
|
||
background: var(--surface);
|
||
border: 1px solid var(--border);
|
||
border-radius: 2px;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.map-header {
|
||
padding: 18px 24px 14px;
|
||
border-bottom: 1px solid var(--border);
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: flex-end;
|
||
}
|
||
|
||
.map-frame-wrap {
|
||
position: relative;
|
||
width: 100%;
|
||
height: 430px;
|
||
background: var(--surface2);
|
||
}
|
||
|
||
.map-frame-wrap iframe { width: 100%; height: 100%; border: none; display: block; }
|
||
|
||
.map-overlay {
|
||
position: absolute;
|
||
bottom: 12px;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
background: rgba(255,255,255,0.9);
|
||
border: 1px solid var(--border);
|
||
padding: 5px 14px;
|
||
border-radius: 2px;
|
||
font-family: 'IBM Plex Mono', monospace;
|
||
font-size: 9px;
|
||
color: var(--muted);
|
||
white-space: nowrap;
|
||
pointer-events: none;
|
||
}
|
||
|
||
.map-footer {
|
||
padding: 12px 24px;
|
||
border-top: 1px solid var(--border);
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
gap: 12px;
|
||
}
|
||
|
||
.map-credit { font-family: 'IBM Plex Mono', monospace; font-size: 9px; color: var(--muted); }
|
||
|
||
.map-link {
|
||
font-family: 'IBM Plex Mono', monospace;
|
||
font-size: 9px;
|
||
color: var(--accent);
|
||
text-decoration: none;
|
||
border-bottom: 1px solid rgba(184,134,11,0.3);
|
||
transition: border-color 0.15s;
|
||
}
|
||
.map-link:hover { border-color: var(--accent); }
|
||
|
||
/* DATA QUALITY */
|
||
.data-quality { display: flex; gap: 16px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); flex-wrap: wrap; }
|
||
.dq-item { display: flex; align-items: center; gap: 8px; font-family: 'IBM Plex Mono', monospace; font-size: 10px; color: var(--muted); }
|
||
.dq-block { width: 12px; height: 12px; border-radius: 1px; flex-shrink: 0; }
|
||
|
||
/* SOURCES */
|
||
.sources {
|
||
border-top: 1px solid var(--border);
|
||
padding: 20px 48px;
|
||
display: flex;
|
||
gap: 16px;
|
||
flex-wrap: wrap;
|
||
align-items: center;
|
||
background: var(--surface);
|
||
}
|
||
|
||
.sources-label {
|
||
font-family: 'IBM Plex Mono', monospace;
|
||
font-size: 9px;
|
||
letter-spacing: 0.12em;
|
||
text-transform: uppercase;
|
||
color: var(--muted);
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.source-chip {
|
||
font-family: 'IBM Plex Mono', monospace;
|
||
font-size: 9px;
|
||
color: var(--muted);
|
||
background: var(--surface2);
|
||
border: 1px solid var(--border);
|
||
padding: 3px 8px;
|
||
border-radius: 1px;
|
||
text-decoration: none;
|
||
transition: background 0.15s, border-color 0.15s, color 0.15s;
|
||
}
|
||
|
||
a.source-chip:hover { background: var(--bg); border-color: var(--accent); color: var(--accent); }
|
||
.source-chip.verified { border-color: rgba(45,122,74,0.4); color: var(--verified); }
|
||
a.source-chip.verified:hover { border-color: var(--verified); color: var(--verified); }
|
||
.source-chip.official { border-color: rgba(26,74,138,0.4); color: var(--official); }
|
||
a.source-chip.official:hover { border-color: var(--official); color: var(--official); }
|
||
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<!-- ═══ HEADER ═══════════════════════════════════════════════════════════════ -->
|
||
<div class="header">
|
||
<div>
|
||
<div class="header-species">Vespa velutina nigrithorax · Espèce exotique envahissante · Danger sanitaire 2ème catégorie depuis 2012</div>
|
||
<div class="header-title">FRELON<br><span>ASIATIQUE</span><br>EN FRANCE</div>
|
||
<div class="header-subtitle">Vingt ans d'invasion : données épidémiologiques, estimations de population, plan national 2026</div>
|
||
</div>
|
||
<div class="header-right">
|
||
<div>
|
||
<div class="badge-year">20</div>
|
||
<div class="badge-year" style="margin-top:-20px">ANS</div>
|
||
<div class="badge-label" style="text-align:right">D'INVASION · 2004–2026</div>
|
||
</div>
|
||
<button class="btn-print no-print" onclick="window.print()">⎙ Imprimer / PDF</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ═══ KPI ROW ════════════════════════════════════════════════════════════ -->
|
||
<div class="main" style="padding-bottom:0;">
|
||
<div class="kpis">
|
||
<div class="kpi k-verified">
|
||
<div class="kpi-label">Départements touchés · 2026</div>
|
||
<div class="kpi-value">101/101</div>
|
||
<div class="kpi-unit">tous les dép. métropolitains</div>
|
||
</div>
|
||
<div class="kpi k-est">
|
||
<div class="kpi-label">Nids signalés / an · 2024–25</div>
|
||
<div class="kpi-value">13–15k</div>
|
||
<div class="kpi-unit">nids déclarés (5–10% du réel)</div>
|
||
</div>
|
||
<div class="kpi k-est">
|
||
<div class="kpi-label">Nids estimés en France · 2024</div>
|
||
<div class="kpi-value">~500k</div>
|
||
<div class="kpi-unit">ordre de grandeur · extrapolation</div>
|
||
</div>
|
||
<div class="kpi k-proj">
|
||
<div class="kpi-label">Pertes filière apicole / an</div>
|
||
<div class="kpi-value">98M€</div>
|
||
<div class="kpi-unit">pertes estimées (UNAF)</div>
|
||
</div>
|
||
<div class="kpi k-official">
|
||
<div class="kpi-label">Plan national 2026 · budget</div>
|
||
<div class="kpi-value">3M€</div>
|
||
<div class="kpi-unit">par an sur 6 ans · Ministère TE</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ═══ PLAN NATIONAL ══════════════════════════════════════════════════════ -->
|
||
<div class="main" style="padding-top:16px; padding-bottom:0;">
|
||
<div class="plan-banner">
|
||
<div class="plan-logo">OFFICIEL</div>
|
||
<div>
|
||
<div class="plan-tag">Dossier de presse officiel · Ministère de la Transition Écologique · 27 mars 2026</div>
|
||
<div class="plan-title">Plan National de Lutte<br>contre le <span>Frelon Asiatique</span></div>
|
||
<div class="plan-text">
|
||
Présenté dans les Vosges par le ministre Mathieu Lefèvre, en application de la <strong>loi n°2025-237 du 14 mars 2025</strong>.
|
||
Le plan acte officiellement que <strong>l'éradication n'est plus envisageable</strong>.
|
||
La stratégie repose désormais sur la limitation des impacts :
|
||
piégeage sélectif, destruction de nids par des professionnels,
|
||
protection des ruchers (muselières, harpes), déclaration obligatoire des nids.
|
||
Un guichet collectivités / associations a ouvert le <strong>1er mai 2026</strong>.
|
||
L'espèce a atteint <strong>9 pays européens</strong>, dont la Hongrie en 2024.
|
||
</div>
|
||
</div>
|
||
<div class="plan-kpis">
|
||
<div class="plan-kpi">
|
||
<div class="plan-kpi-val">9</div>
|
||
<div class="plan-kpi-lbl">pays européens<br>concernés</div>
|
||
</div>
|
||
<div class="plan-kpi">
|
||
<div class="plan-kpi-val">40%</div>
|
||
<div class="plan-kpi-lbl">abeilles dans<br>l'alimentation</div>
|
||
</div>
|
||
<div class="plan-kpi">
|
||
<div class="plan-kpi-val">30%</div>
|
||
<div class="plan-kpi-lbl">colonies pouvant<br>disparaître/an</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ═══ CHARTS ══════════════════════════════════════════════════════════════ -->
|
||
<div class="main" style="padding-top:16px;">
|
||
|
||
<!-- CHART 1 : DÉPARTEMENTS -->
|
||
<div class="card">
|
||
<div class="card-title">Expansion géographique</div>
|
||
<div class="card-heading">Départements colonisés par année</div>
|
||
<div class="chart-wrap"><canvas id="deptChart"></canvas></div>
|
||
<div class="legend">
|
||
<div class="legend-item"><div class="legend-dot" style="background:var(--verified)"></div>Données vérifiées (MNHN/INPN)</div>
|
||
<div class="legend-item"><div class="legend-dot" style="background:var(--estimated)"></div>Sources consolidées</div>
|
||
</div>
|
||
<div class="data-quality">
|
||
<div class="dq-item"><div class="dq-block" style="background:var(--verified)"></div>Publications scientifiques</div>
|
||
<div class="dq-item"><div class="dq-block" style="background:var(--estimated)"></div>AN / rapports officiels</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- CHART 2 : NIDS + PROJECTION -->
|
||
<div class="card">
|
||
<div class="card-title">Pression d'infestation</div>
|
||
<div class="card-heading">Nids signalés, estimés & projection</div>
|
||
<div class="chart-wrap"><canvas id="nidsChart"></canvas></div>
|
||
<div class="legend">
|
||
<div class="legend-item"><div class="legend-dot" style="background:var(--verified)"></div>Signalements confirmés</div>
|
||
<div class="legend-item"><div class="legend-dot" style="background:rgba(184,134,11,0.45)"></div>Estimation totale (×30–50)</div>
|
||
<div class="legend-item"><div class="legend-dash"></div>Tendance +15–20%/an</div>
|
||
</div>
|
||
<div class="data-quality">
|
||
<div class="dq-item"><div class="dq-block" style="background:rgba(45,122,74,0.4); border:1px solid var(--verified)"></div>Seuls 5–10% des nids réels sont signalés</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- CHART 3 : MANCHE -->
|
||
<div class="card">
|
||
<div class="card-title">Zoom département · Données annuelles continues</div>
|
||
<div class="card-heading">Nids localisés — Manche (50) · 2022–2024</div>
|
||
<div class="chart-wrap-sm"><canvas id="mancheChart"></canvas></div>
|
||
<div style="margin-top:10px; font-size:12px; font-weight:300; color:var(--muted); line-height:1.5;">
|
||
Seul département avec une série annuelle continue publiée. La baisse 2022→2024 illustre une possible saturation locale combinée à l'intensification de la lutte collective (FDGDON 50). À ne pas généraliser à l'échelle nationale.
|
||
</div>
|
||
<div class="data-quality">
|
||
<div class="dq-item"><div class="dq-block" style="background:var(--verified)"></div>Source : FDGDON Manche — bilans annuels publiés</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- IMPACT ABEILLES -->
|
||
<div class="card">
|
||
<div class="card-title">Impact filière apicole & biodiversité</div>
|
||
<div class="card-heading">Chiffres clés — dossier officiel mars 2026</div>
|
||
<div class="impact-grid">
|
||
<div class="impact-item">
|
||
<div class="impact-val" style="color:var(--projected)">40%</div>
|
||
<div class="impact-label">des proies capturées sont des abeilles domestiques</div>
|
||
<div class="impact-source">Plan national · MNHN</div>
|
||
</div>
|
||
<div class="impact-item">
|
||
<div class="impact-val" style="color:var(--projected)">20%</div>
|
||
<div class="impact-label">taux de mortalité des abeilles causé par le frelon asiatique</div>
|
||
<div class="impact-source">Dossier de presse officiel mars 2026</div>
|
||
</div>
|
||
<div class="impact-item">
|
||
<div class="impact-val" style="color:var(--estimated)">30%</div>
|
||
<div class="impact-label">des colonies peuvent disparaître à l'échelle nationale chaque année dans les cas les plus sévères</div>
|
||
<div class="impact-source">Plan national mars 2026</div>
|
||
</div>
|
||
<div class="impact-item">
|
||
<div class="impact-val" style="color:var(--estimated)">10 kg</div>
|
||
<div class="impact-label">d'insectes consommés par nid sur une saison, soit >100 000 individus</div>
|
||
<div class="impact-source">UNAF / Plan national 2026</div>
|
||
</div>
|
||
<div class="impact-item" style="grid-column:1/-1;">
|
||
<div class="impact-val" style="color:var(--verified); font-size:22px">85% de l'alimentation</div>
|
||
<div class="impact-label">est composée d'abeilles, guêpes et mouches — dont 40% d'abeilles domestiques. Les 60% restants : diptères, hyménoptères, lépidoptères — autant de pollinisateurs sauvages déjà en déclin documenté en Europe.</div>
|
||
<div class="impact-source">Dossier de presse — Ministère de la Transition Écologique, mars 2026</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- MILESTONES -->
|
||
<div class="card">
|
||
<div class="card-title">Chronologie clé</div>
|
||
<div class="card-heading">Jalons de l'invasion & réponse institutionnelle</div>
|
||
<div class="milestones">
|
||
<div class="milestone">
|
||
<div class="milestone-year">2004</div>
|
||
<div class="milestone-text">2 premiers nids, Lot-et-Garonne. Introduction via poteries chinoises. Une unique reine fécondée à l'origine de toute l'invasion.</div>
|
||
<div class="milestone-source">SOURCE : INPN/MNHN (Rome & Villemant, 2006) · Dossier de presse officiel 2026</div>
|
||
</div>
|
||
<div class="milestone">
|
||
<div class="milestone-year">2006</div>
|
||
<div class="milestone-text">13 départements touchés. Premiers signalements apiculteurs. Progression : ~78 km/an.</div>
|
||
<div class="milestone-source">SOURCE : MNHN / INPN</div>
|
||
</div>
|
||
<div class="milestone est">
|
||
<div class="milestone-year">2010</div>
|
||
<div class="milestone-text">~40 départements. Milliers de nids estimés. Premiers nids en Espagne (Pays basque).</div>
|
||
<div class="milestone-source">SOURCE : PAT Frelons / AAAFA</div>
|
||
</div>
|
||
<div class="milestone">
|
||
<div class="milestone-year">2012</div>
|
||
<div class="milestone-text">56 départements. Classé espèce exotique envahissante et danger sanitaire 2ème catégorie.</div>
|
||
<div class="milestone-source">SOURCE : Assemblée nationale Q5422 / Code rural</div>
|
||
</div>
|
||
<div class="milestone est">
|
||
<div class="milestone-year">2015</div>
|
||
<div class="milestone-text">~75 départements. Centaines de milliers de nids. Présence en 5 pays européens.</div>
|
||
<div class="milestone-source">SOURCE : PAT Frelons / MNHN</div>
|
||
</div>
|
||
<div class="milestone">
|
||
<div class="milestone-year">2020–22</div>
|
||
<div class="milestone-text">Quasi-totalité du territoire colonisé. Manche : 9 924 nids signalés en 2022 (pic). Plan OVS/FREDON publié.</div>
|
||
<div class="milestone-source">SOURCE : FREDON France / FDGDON Manche</div>
|
||
</div>
|
||
<div class="milestone est">
|
||
<div class="milestone-year">2023–24</div>
|
||
<div class="milestone-text">7 500 → 13 000 nids signalés (+78%). ~500 000 nids estimés. Hongrie atteinte. 9 pays européens.</div>
|
||
<div class="milestone-source">SOURCE : SignalNids / plateforme nationale / Dossier presse officiel 2026</div>
|
||
</div>
|
||
<div class="milestone official">
|
||
<div class="milestone-year">Mars 2025</div>
|
||
<div class="milestone-text">Loi n°2025-237 : déclaration des nids obligatoire. 12M€ de compensations aux apiculteurs.</div>
|
||
<div class="milestone-source">SOURCE : Légifrance — Loi n°2025-237 du 14 mars 2025</div>
|
||
</div>
|
||
<div class="milestone official">
|
||
<div class="milestone-year">Mars 2026</div>
|
||
<div class="milestone-text">Plan national lancé : 3M€/an sur 6 ans. Réseau de référents départementaux. Guichet dédié ouvert le 1er mai. Éradication officiellement écartée.</div>
|
||
<div class="milestone-source">SOURCE : Dossier de presse — Ministère de la Transition Écologique</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- BIOLOGIE -->
|
||
<div class="card">
|
||
<div class="card-title">Biologie de la colonisation</div>
|
||
<div class="card-heading">Pourquoi la population ne plafonne pas</div>
|
||
<div style="display:grid; gap:12px; margin-top:4px;">
|
||
<div style="display:flex; gap:12px; align-items:flex-start; padding:12px; background:var(--surface2); border:1px solid var(--border); border-left:3px solid var(--accent);">
|
||
<div style="font-size:22px;flex-shrink:0">🐝</div>
|
||
<div>
|
||
<div style="font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:4px">Reproduction explosive</div>
|
||
<div style="font-size:12px;font-weight:300;line-height:1.5;color:var(--text)">Chaque nid mature libère <strong style="color:var(--accent)">500 à 1 500 reines fondatrices</strong> par saison (Rome et al., 2015). Mortalité printanière élevée, mais le surplus compense très largement.</div>
|
||
</div>
|
||
</div>
|
||
<div style="display:flex; gap:12px; align-items:flex-start; padding:12px; background:var(--surface2); border:1px solid var(--border); border-left:3px solid var(--estimated);">
|
||
<div style="font-size:22px;flex-shrink:0">📊</div>
|
||
<div>
|
||
<div style="font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--estimated);margin-bottom:4px">Production par nid</div>
|
||
<div style="font-size:12px;font-weight:300;line-height:1.5;color:var(--text)">Jusqu'à <strong style="color:var(--estimated)">13 000 individus</strong> sur la saison (max 2 000 adultes simultanés en octobre). Taille corrélée au nombre d'individus (MNHN, 2015).</div>
|
||
</div>
|
||
</div>
|
||
<div style="display:flex; gap:12px; align-items:flex-start; padding:12px; background:var(--surface2); border:1px solid var(--border); border-left:3px solid var(--verified);">
|
||
<div style="font-size:22px;flex-shrink:0">🌍</div>
|
||
<div>
|
||
<div style="font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--verified);margin-bottom:4px">Absence de prédateurs spécifiques</div>
|
||
<div style="font-size:12px;font-weight:300;line-height:1.5;color:var(--text)">Confirmé par le plan national 2026. Grande plasticité écologique : urbain, rural, altitude croissante avec le réchauffement climatique.</div>
|
||
</div>
|
||
</div>
|
||
<div style="display:flex; gap:12px; align-items:flex-start; padding:12px; background:var(--surface2); border:1px solid var(--border); border-left:3px solid var(--projected);">
|
||
<div style="font-size:22px;flex-shrink:0">⚠️</div>
|
||
<div>
|
||
<div style="font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--projected);margin-bottom:4px">Piégeage : efficacité très limitée</div>
|
||
<div style="font-size:12px;font-weight:300;line-height:1.5;color:var(--text)">MNHN/ITSAP : piégeage printanier laisse place à d'autres fondatrices. <strong style="color:var(--projected)">>99%</strong> des captures sont des insectes non-cibles (pièges bouteille). Le plan 2026 impose les pièges sélectifs.</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="alert" style="margin-top:16px;">
|
||
<div class="alert-icon">🔬</div>
|
||
<div class="alert-body">
|
||
<strong>Aucun plafond démographique identifié à ce jour.</strong> Le dossier officiel de mars 2026 confirme que l'éradication n'est plus envisageable. Les modèles prévoient une invasion quasi-totale de l'Europe occidentale d'ici 10 ans (CNRS).
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- CARTE SIGNALNIDS -->
|
||
<div class="map-card no-print">
|
||
<div class="map-header">
|
||
<div>
|
||
<div class="card-title" style="margin-bottom:4px">Carte de signalement en temps réel</div>
|
||
<div class="card-heading" style="margin-bottom:0;border-bottom:none;padding-bottom:0">Nids déclarés — SignalNids.fr</div>
|
||
</div>
|
||
<a class="map-link" href="https://signalnids.fr/carte/" target="_blank" rel="noopener">Ouvrir la carte complète ↗</a>
|
||
</div>
|
||
<div class="map-frame-wrap">
|
||
<iframe
|
||
src="https://signalnids.fr/carte/"
|
||
title="Carte interactive des nids de frelons asiatiques — SignalNids.fr"
|
||
loading="lazy"
|
||
sandbox="allow-scripts allow-same-origin allow-forms allow-popups"
|
||
></iframe>
|
||
<div class="map-overlay">Carte interactive · Cliquer pour interagir · Données temps réel : SignalNids.fr</div>
|
||
</div>
|
||
<div class="map-footer">
|
||
<div class="map-credit">Source : <strong>SignalNids.fr</strong> · Plateforme de signalement participatif · Mise à jour en temps réel · Données non officielles</div>
|
||
<a class="map-link" href="https://signalnids.fr/carte/" target="_blank" rel="noopener">signalnids.fr/carte/ ↗</a>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ALERTE MÉTHODOLOGIQUE -->
|
||
<div class="alert" style="grid-column:1/-1; margin:0;">
|
||
<div class="alert-icon">📌</div>
|
||
<div class="alert-body">
|
||
<strong>Limites méthodologiques :</strong> les données de signalement ne représentent que 5 à 10% des nids réels. Il n'existe pas de comptage national exhaustif. Les estimations de population totale sont des extrapolations — ordres de grandeur, non des valeurs précises. Sources primaires scientifiques : INPN/MNHN (Rome, Villemant et al.) · Données officielles : Dossier de presse Plan national — Ministère de la Transition Écologique, mars 2026.
|
||
</div>
|
||
</div>
|
||
|
||
</div><!-- /main -->
|
||
|
||
<!-- ═══ SOURCES ═════════════════════════════════════════════════════════════ -->
|
||
<div class="sources">
|
||
<div class="sources-label">Sources</div>
|
||
<a class="source-chip verified" href="https://frelonasiatique.mnhn.fr/" target="_blank" rel="noopener">MNHN/INPN · Rome & Villemant</a>
|
||
<a class="source-chip official" href="https://www.ecologie.gouv.fr/politiques-publiques/produits-biocides" target="_blank" rel="noopener">Plan national · Ministère TE · Mars 2026</a>
|
||
<a class="source-chip verified" href="https://questions.assemblee-nationale.fr/q16/16-5422QE.htm" target="_blank" rel="noopener">Assemblée nationale Q16-5422</a>
|
||
<a class="source-chip verified" href="https://www.inee.cnrs.fr/fr/cnrsinfo/invasion-du-frelon-asiatique-en-france-le-cout-de-la-lutte" target="_blank" rel="noopener">CNRS Écologie & Environnement</a>
|
||
<a class="source-chip" href="https://www.fdgdon50.com/Frelons-asiatiques" target="_blank" rel="noopener">FDGDON Manche · bilans annuels</a>
|
||
<a class="source-chip" href="https://www.patfrelons.fr/evolution-du-frelon-asiatique-en-france-et-en-europe/" target="_blank" rel="noopener">PAT Frelons</a>
|
||
<a class="source-chip" href="https://signalnids.fr/journal/frelon-asiatique-chiffres-2026/" target="_blank" rel="noopener">SignalNids.fr</a>
|
||
<a class="source-chip" href="https://frelonasiatique.mnhn.fr/plan-national-de-lutte-des-ovs-2024/" target="_blank" rel="noopener">FREDON France / GDS France</a>
|
||
<a class="source-chip official" href="https://www.legifrance.gouv.fr/jorf/id/JORFTEXT000051254501" target="_blank" rel="noopener">Loi n°2025-237 · 14 mars 2025</a>
|
||
<a class="source-chip" href="https://www.plateforme-esa.fr/fr/frelon-asiatique" target="_blank" rel="noopener">ITSAP / Plateforme ESA</a>
|
||
</div>
|
||
|
||
<script>
|
||
// ═══ CHART 1 — DÉPARTEMENTS ════════════════════════════════════════════════
|
||
new Chart(document.getElementById('deptChart').getContext('2d'), {
|
||
type: 'bar',
|
||
data: {
|
||
labels: [2004,2006,2008,2010,2012,2014,2016,2018,2020,2022,2025],
|
||
datasets: [{
|
||
data: [1,13,30,40,56,67,78,88,95,100,101],
|
||
backgroundColor: [2004,2006,2008,2010,2012,2014,2016,2018,2020,2022,2025].map(y => y<=2020?'rgba(45,122,74,0.75)':'rgba(184,134,11,0.75)'),
|
||
borderColor: [2004,2006,2008,2010,2012,2014,2016,2018,2020,2022,2025].map(y => y<=2020?'#2d7a4a':'#b8860b'),
|
||
borderWidth: 1.5, borderRadius: 1
|
||
}]
|
||
},
|
||
options: {
|
||
responsive: true, maintainAspectRatio: false,
|
||
plugins: {
|
||
legend: { display: false },
|
||
tooltip: {
|
||
backgroundColor:'#fff', borderColor:'#ddd8cc', borderWidth:1,
|
||
titleColor:'#b8860b', bodyColor:'#1a1a14',
|
||
titleFont:{family:"'IBM Plex Mono',monospace",size:10},
|
||
bodyFont:{family:"'Source Serif 4',serif",size:12},
|
||
callbacks: {
|
||
title: i => `Année ${i[0].label}`,
|
||
label: i => ` ${i.raw} départements / 101`,
|
||
afterLabel: i => i.label<=2020 ? ' ✓ Source : MNHN/INPN' : ' ~ Sources multiples consolidées'
|
||
}
|
||
}
|
||
},
|
||
scales: {
|
||
x: { grid:{color:'rgba(0,0,0,0.07)'}, ticks:{color:'#7a7060',font:{family:"'IBM Plex Mono',monospace",size:9}}, border:{color:'#ddd8cc'} },
|
||
y: { min:0, max:101, grid:{color:'rgba(0,0,0,0.07)'}, ticks:{color:'#7a7060',font:{family:"'IBM Plex Mono',monospace",size:9}, callback:v=>v+' dép.'}, border:{color:'#ddd8cc'} }
|
||
}
|
||
}
|
||
});
|
||
|
||
// ═══ CHART 2 — NIDS + PROJECTION ══════════════════════════════════════════
|
||
new Chart(document.getElementById('nidsChart').getContext('2d'), {
|
||
type: 'bar',
|
||
data: {
|
||
labels: [2020,2021,2022,2023,2024,2025,2026],
|
||
datasets: [
|
||
{
|
||
type:'bar', label:'Signalements confirmés',
|
||
data:[null,null,null,7500,13000,14000,null],
|
||
backgroundColor:'rgba(45,122,74,0.75)', borderColor:'#2d7a4a',
|
||
borderWidth:1.5, borderRadius:1, yAxisID:'y', order:2
|
||
},
|
||
{
|
||
type:'bar', label:'Estimation totale 2024',
|
||
data:[null,null,null,null,500000,null,null],
|
||
backgroundColor:'rgba(184,134,11,0.13)', borderColor:'rgba(184,134,11,0.5)',
|
||
borderWidth:1.5, borderRadius:1, yAxisID:'y', order:3
|
||
},
|
||
{
|
||
type:'bar', label:'Projection 2026',
|
||
data:[null,null,null,null,null,null,300000],
|
||
backgroundColor:'rgba(201,79,26,0.13)', borderColor:'rgba(201,79,26,0.55)',
|
||
borderWidth:1.5, borderRadius:1, yAxisID:'y', order:4
|
||
},
|
||
{
|
||
type:'line', label:'Tendance +15-20%/an',
|
||
data:[null,null,null,7500,13000,15000,17500],
|
||
borderColor:'rgba(201,79,26,0.65)', borderWidth:2, borderDash:[5,4],
|
||
pointBackgroundColor:'rgba(201,79,26,0.7)',
|
||
pointRadius:[0,0,0,4,4,4,4], pointHoverRadius:6,
|
||
fill:false, tension:0.35, yAxisID:'y', order:1
|
||
}
|
||
]
|
||
},
|
||
options: {
|
||
responsive:true, maintainAspectRatio:false,
|
||
plugins: {
|
||
legend:{display:false},
|
||
tooltip:{
|
||
backgroundColor:'#fff', borderColor:'#ddd8cc', borderWidth:1,
|
||
titleColor:'#b8860b', bodyColor:'#1a1a14',
|
||
titleFont:{family:"'IBM Plex Mono',monospace",size:10},
|
||
bodyFont:{family:"'Source Serif 4',serif",size:11},
|
||
callbacks: {
|
||
title: i => `Année ${i[0].label}`,
|
||
label: item => {
|
||
if(item.raw===null||item.raw===undefined) return null;
|
||
const k = item.raw>=1000 ? `${(item.raw/1000).toFixed(0)}k` : item.raw;
|
||
return [' Signalés : ',' Estimés totaux : ~',' Projection : ~',' Tendance : ~'][item.datasetIndex]+k+' nids';
|
||
},
|
||
afterLabel: item => {
|
||
if(item.datasetIndex===1) return ' ⚠ Extrapolation — non officiel';
|
||
if(item.datasetIndex===2) return ' ⚠ Projection — non officielle';
|
||
return '';
|
||
}
|
||
},
|
||
filter: item => item.raw!==null && item.raw!==undefined
|
||
}
|
||
},
|
||
scales: {
|
||
x: { grid:{color:'rgba(0,0,0,0.07)'}, ticks:{color:'#7a7060',font:{family:"'IBM Plex Mono',monospace",size:9}}, border:{color:'#ddd8cc'} },
|
||
y: { min:0, grid:{color:'rgba(0,0,0,0.07)'}, ticks:{color:'#7a7060',font:{family:"'IBM Plex Mono',monospace",size:9}, callback:v=>v>=1000?`${(v/1000).toFixed(0)}k`:v}, border:{color:'#ddd8cc'} }
|
||
}
|
||
}
|
||
});
|
||
|
||
// ═══ CHART 3 — MANCHE ══════════════════════════════════════════════════════
|
||
new Chart(document.getElementById('mancheChart').getContext('2d'), {
|
||
type: 'bar',
|
||
data: {
|
||
labels: ['2022','2023','2024'],
|
||
datasets: [{
|
||
data: [9924,7077,5083],
|
||
backgroundColor: ['rgba(201,79,26,0.7)','rgba(45,122,74,0.65)','rgba(45,122,74,0.65)'],
|
||
borderColor: ['#c94f1a','#2d7a4a','#2d7a4a'],
|
||
borderWidth:1.5, borderRadius:1
|
||
}]
|
||
},
|
||
options: {
|
||
responsive:true, maintainAspectRatio:false,
|
||
plugins: {
|
||
legend:{display:false},
|
||
tooltip:{
|
||
backgroundColor:'#fff', borderColor:'#ddd8cc', borderWidth:1,
|
||
titleColor:'#b8860b', bodyColor:'#1a1a14',
|
||
titleFont:{family:"'IBM Plex Mono',monospace",size:10},
|
||
bodyFont:{family:"'Source Serif 4',serif",size:12},
|
||
callbacks:{
|
||
title: i => `Manche (50) — ${i[0].label}`,
|
||
label: item => ` ${item.raw.toLocaleString('fr-FR')} nids localisés & signalés`,
|
||
afterLabel: () => ' Source : FDGDON Manche — bilan annuel'
|
||
}
|
||
}
|
||
},
|
||
scales: {
|
||
x: { grid:{color:'rgba(0,0,0,0.07)'}, ticks:{color:'#7a7060',font:{family:"'IBM Plex Mono',monospace",size:9}}, border:{color:'#ddd8cc'} },
|
||
y: { min:0, grid:{color:'rgba(0,0,0,0.07)'}, ticks:{color:'#7a7060',font:{family:"'IBM Plex Mono',monospace",size:9}, callback:v=>v.toLocaleString('fr-FR')}, border:{color:'#ddd8cc'} }
|
||
}
|
||
}
|
||
});
|
||
</script>
|
||
</body>
|
||
</html>
|