CarteVoyageGie/README.md

CarteVoyageGie

Carte du monde interactive plein écran pour visualiser des destinations de voyage et leur niveau d'autorisation, avec affichage détaillé par pays.

Objectif

L'application affiche une carte mondiale cliquable, colorée par catégorie d'autorisation (codes métier), avec :

• zoom/pan,
• recherche pays,
• liste triée alphabétiquement,
• modal de détail au clic,
• version adaptée desktop et mobile.

Fonctionnalités

• Carte monde interactive (D3 + GeoJSON Natural Earth).
• Coloration des pays par code d'autorisation.
• Modal pays au clic avec :
  • drapeau + nom,
  • catégorie explicite,
  • période de validité,
  • procédure synthétisée.
• Tooltip au survol.
• Zoom sur le pays sélectionné.
• Légende des catégories.
• Liste flottante des pays avec recherche (desktop).
• Boutons mobiles :
  • loupe pour ouvrir la recherche en modal,
  • bouton pour ouvrir/fermer la légende.
• Thème dark.

Codes d'autorisation et couleurs

• 10 : vert
• 21, 22, 23 : jaune
• 99 : rouge
• 30 : noir (affiché en dernier dans la légende)
• sans donnée : gris neutre

Données

Source locale

• znep_gta_pays_etrangers.txt : données brutes des pays/catégories.

Source cartographique

• GeoJSON Natural Earth chargé depuis :
  • https://raw.githubusercontent.com/nvkelso/natural-earth-vector/master/geojson/ne_50m_admin_0_map_units.geojson

Traitement

• Parsing du fichier brut côté navigateur.
• Appariement par ISO2 en priorité.
• Fallback par normalisation de nom (accents/variantes).
• Redirections de certains territoires vers pays parent (exemple : Nouvelle-Calédonie -> France).
• Synthèse des libellés procédure pour affichage court en modal.

Interface

Desktop

• Carte plein écran.
• Titre en haut à gauche.
• Liste pays flottante à gauche.
• Légende à droite.
• Footer bas-centre avec lien dépôt.

Mobile

• Carte plein écran.
• Bouton 🔍 pour la recherche des pays (modal).
• Bouton Légende pour afficher/masquer la légende.
• Champ recherche en font-size: 16px pour limiter les zooms iOS.

Structure du projet

• index.html : structure UI.
• styles.css : thème, responsive, composants visuels.
• script.js : logique carte, parsing données, interactions.
• znep_gta_pays_etrangers.txt : dataset métier brut.
• robots.txt : blocage robots/crawlers.
• .gitignore : exclusions locales.

Lancer en local

Depuis la racine du projet :

python3 -m http.server 8008

Puis ouvrir :

• http://localhost:8008

Protection anti-robots

La protection anti-indexation/crawling est configurée par :

• robots.txt avec Disallow: / (global + quelques user agents IA),
• meta tags robots, googlebot, bingbot en noindex,nofollow,... dans index.html.

Important : ces mécanismes reposent sur la bonne volonté des robots.
Pour renforcer côté production, ajouter des en-têtes HTTP (X-Robots-Tag) au niveau du serveur web/reverse proxy.

Dépôt Git

• URL : git@git.goutfer.fr:benjamin/CarteVoyageGie.git
• Lien web : https://git.goutfer.fr/benjamin/CarteVoyageGie

Auteur

• Benjamin GOUTFER (MDC)