carte interactive de la température au Maroc

Description du projet

Ce projet consiste à concevoir une application web cartographique capable de visualiser, explorer et analyser des données climatiques massives (atmosphère, océan, air, etc.) sur un contexte marocain, avec un focus sur la dimension spatio-temporelle (animation, séries temporelles, comparaisons).

L’idée centrale est de passer d’un “fichier scientifique lourd” (NetCDF/GRIB/Zarr) à une expérience interactive fluide dans un navigateur, tout en comparant plusieurs approches de publication (WMS/WMTS, tuiles raster/vector, WebGL).

Objectifs

Sélectionner un jeu de données (ERA5 reanalysis, GraphCast / prévisions globales) pertinent pour le Maroc : température, vent, précipitations, pression, humidité, vagues, poussières/aérosols, etc.

Mettre en place une chaîne de diffusion web scalable : stockage, prétraitement, pyramides/tiling, serveur carto, cache.

Développer une interface interactive :

animation temporelle (timeline + lecture automatique),

info locale (valeur au point, extraction d’une série temporelle),

légende dynamique (palette + min/max + unités),

couches multiples et comparaison (avant/après, split view).

Évaluer performances et qualité : temps de chargement, fluidité du zoom/pan, précision, artefacts visuels, coût de calcul et stockage.

Périmètre fonctionnel

1) Données et zone d’étude

Zone : Maroc (avec marge régionale si nécessaire).

Variables candidates :

Température (2m), vent (10m), précipitations, pression, humidité,

optionnel : chaleur, indices météo, vagues, aérosols/poussières.

Dimension temporelle :

ERA5 : historique/continu (horaire ou quotidien),

GraphCast : prévision (horizons + pas de temps).

2) Techniques de publication comparées

WMS (simple à intégrer, mais lourd côté rendu si mal optimisé).

WMTS / tuiles pré-générées (rapide côté client, stockage plus important).

Approches WebGL (rendu fluide, interaction avancée) :

Deck.GL (textures raster, GPU),

Cesium (3D/terrain si utile),

TerriaJS (catalogue, couches multiples, UX orientée données).

3) Interface web (produit final attendu)

Carte interactive (pan/zoom, choix couche, opacité, basemap).

Curseur temporel + animation (play/pause, vitesse).

Tooltip au survol + graphique (série temporelle au clic).

Légende dynamique (palette, unités, échelle, seuils).

Outils : sélection d’une région, export image, capture d’écran, téléchargement stats.

Architecture technique (exemple)

Prétraitement : conversion NetCDF/GRIB → GeoTIFF/COG ou Zarr, reprojection, agrégation (jour/mois), création de pyramides.

Serveur : GeoServer (WMS/WMTS) ou services tuilés dédiés + cache (GeoWebCache).

Client web : OpenLayers/Leaflet + module time + WebGL (Deck.GL/Cesium) + graphiques (Plotly/Chart.js).

Optimisation : tuilage, cache, niveaux de zoom, compression, limitation des requêtes, chargement progressif.

Analyse des performances (ce que le projet mesure)

Temps d’affichage initial (première carte).

Fluidité (FPS ressenti) lors du zoom/pan.

Coût réseau (taille des tuiles/frames, nombre de requêtes).

Temps d’animation temporelle (latence entre pas de temps).

Qualité visuelle : artefacts, continuité, lisibilité de la palette, cohérence des unités.

Scalabilité : ajout de variables, extension temporelle, multi-utilisateurs