correction map resultats déclarations

Author: ThibautMn

frontend/src/components/map/base-map.vue

@@ -229,8 +229,15 @@ export default {
     // Le service sera stocké dans state._mapServices.
     this.$store.commit('setMapService', this.mapService);
 
-    // Initialise les couches, tuiles et marqueurs de la carte.
-    this.mapService.init();
+    // Initialise les couches, tuiles et marqueurs de la carte, une fois que Vue a appliqué au DOM
+    // la vraie hauteur du conteneur (computedHeight passe de "0px" à sa valeur réelle avec bInit).
+    // Sans ce $nextTick, L.map() est créée sur un conteneur de hauteur 0 : le fond de carte ne
+    // couvre pas toute la zone visible (grisé en bas) et l'ajout des marqueurs plante (le rendu SVG
+    // de Leaflet n'a pas encore de bounds valides), ce qui empêche aussi les marqueurs suivants de
+    // s'afficher.
+    this.$nextTick(() => {
+      this.mapService.init();
+    });
 
     // Ajoute un écouteur d'événement sur l'élément DOM de la carte.
     // Cet événement "layer-data" permet de gérer la sélection dynamique des couches.

frontend/src/components/map/map-elements/map-layer.js

@@ -132,7 +132,13 @@ const mapLayer = {
    * zoom on layer
    */
   zoomOnLayer: function (layer) {
-    this._map.fitBounds(layer.getBounds());
+    const bounds = layer.getBounds();
+    // Une couche sans géométrie valide (ex: réponse API vide) donne des bounds invalides ;
+    // fitBounds lèverait alors une exception qui empêcherait toute correction ultérieure du zoom.
+    if (!bounds.isValid()) {
+      return;
+    }
+    this._map.fitBounds(bounds);
   },
 
   reinitZoom() {
@@ -153,6 +159,9 @@ const mapLayer = {
     }
     const layersGroup = L.featureGroup(layers);
     const bounds = layersGroup.getBounds();
+    if (!bounds.isValid()) {
+      return false;
+    }
     this._map.fitBounds(bounds);
     return true;
   },

frontend/src/components/map/map-elements/map-marker.js

@@ -64,7 +64,13 @@ const mapMarker = {
   initMarkers() {
     this.removeMarkers();
     for (const marker of this._config.markers || []) {
-      this.addMarker(marker);
+      // Un marqueur en erreur (ex: carte pas encore correctement dimensionnée) ne doit pas
+      // empêcher l'ajout de tous les marqueurs suivants de la boucle.
+      try {
+        this.addMarker(marker);
+      } catch (error) {
+        console.error('Erreur ajout marqueur carte:', error);
+      }
     }
     this.upConfig();
   },

frontend/src/components/map/map-service.js

@@ -118,11 +118,12 @@ class MapService {
    * 2. Crée l'objet carte Leaflet et définit les options de zoom.
    * 3. Centre la carte sur la vue initiale et le niveau de zoom défini dans la configuration.
    * 4. Ajoute le contrôle d'échelle à la carte.
-   * 5. Initialise les panneaux (panes) pour la gestion des couches.
-   * 6. Initialise les fonds de tuiles (tiles) de la carte.
-   * 7. Initialise les couches supplémentaires (layers).
-   * 8. Initialise les marqueurs sur la carte.
-   * 9. Observe le conteneur et corrige la taille de la carte quand elle change réellement.
+   * 5. Observe le conteneur et corrige la taille de la carte quand elle change réellement
+   *    (avant les étapes suivantes pour rester actif même si l'une d'elles plante).
+   * 6. Initialise les panneaux (panes) pour la gestion des couches.
+   * 7. Initialise les fonds de tuiles (tiles) de la carte.
+   * 8. Initialise les couches supplémentaires (layers).
+   * 9. Initialise les marqueurs sur la carte.
    *
    * @returns {boolean} true si l'initialisation a réussi, false sinon.
    */
@@ -151,22 +152,12 @@ class MapService {
     // 4. Ajoute un contrôle d'échelle (barre d'échelle) à la carte.
     L.control.scale().addTo(this._map);
 
-    // 5. Initialise les panneaux (panes) pour organiser les couches de la carte.
-    this.initPanes();
-
-    // 6. Initialise les fonds de tuiles (tiles) de la carte.
-    this.initTiles();
-
-    // 7. Initialise les couches supplémentaires (layers) sur la carte.
-    this.initLayers();
-
-    // 8. Initialise les marqueurs sur la carte.
-    this.initMarkers();
-
-    // 9. Corrige la taille de la carte quand son conteneur change réellement de dimensions
+    // 5. Corrige la taille de la carte quand son conteneur change réellement de dimensions
     //    (layout Vuetify qui se stabilise, panneau qui s'ouvre/ferme, etc.), au lieu de
     //    la deviner via une salve de setTimeout qui rechargeait les tuiles en aveugle et
     //    provoquait des annulations de requêtes (NS_BINDING_ABORTED) visibles dans Firefox.
+    //    Fait avant l'init des panes/tiles/layers/markers ci-dessous : si l'un d'eux plante,
+    //    l'observer reste quand même actif et peut corriger la taille de la carte après coup.
     const container = document.getElementById(this._id);
     if (container && typeof ResizeObserver !== 'undefined') {
       let debounce;
@@ -181,6 +172,18 @@ class MapService {
       this._resizeObserver.observe(container);
     }
 
+    // 6. Initialise les panneaux (panes) pour organiser les couches de la carte.
+    this.initPanes();
+
+    // 7. Initialise les fonds de tuiles (tiles) de la carte.
+    this.initTiles();
+
+    // 8. Initialise les couches supplémentaires (layers) sur la carte.
+    this.initLayers();
+
+    // 9. Initialise les marqueurs sur la carte.
+    this.initMarkers();
+
     // Retourne true si l'initialisation s'est déroulée correctement.
     return true;
   };