Icones de tailles varibles suivant le zoom

public/views/js/d.map.js

@@ -202,76 +202,68 @@ $(document).ready(function() {
 		);
 	});
 
-	// ---------------------------------------------------------
-	// Icônes
-	// ---------------------------------------------------------
-
-	for (const type in window.poi_icons) {
-		icons[type] = L.icon({
-			iconUrl: window.poi_icons[type],
-			iconSize: [32, 32],
-			iconAnchor: [16, 32],
-			popupAnchor: [0, -32]
-		});
-	}
-
 	// ---------------------------------------------------------
 	// Chargement des POI visibles
 	// ---------------------------------------------------------
 
 	function loadVisiblePois() {
-		if (mymap.getZoom() < 10)
+	    if (mymap.getZoom() < 10)
-			return;
+	        return;
 
-		var b = mymap.getBounds();
+	    var b = mymap.getBounds();
+	    var currentZoom = mymap.getZoom();
 
-		$.getJSON(
+	    // helper local : construit un L.Icon en fonction du type et du zoom
-			root + "poi/api_bbox",
+	    function getMarkerIconFor(type, zoom) {
-			{
+	        var size = (zoom > 11) ? 32 : 24;
-				north: b.getNorth(),
-				south: b.getSouth(),
-				east: b.getEast(),
-				west: b.getWest()
-			},
-			function(pois) {
-				poiLayer.clearLayers();
 
-				pois.forEach(function(poi) {
+            return L.icon({
-					var icon =
+                iconUrl: window.poi_icons[type],
-						icons[poi.type] ||
+                iconSize: [size, size],
-						icons["default"];
+                iconAnchor: [Math.floor(size / 2), size],
+                popupAnchor: [0, -size]
+            });
+	    }
 
-					var marker = L.marker(
+	    $.getJSON(
-						[poi.lat, poi.lon],
+	        root + "poi/api_bbox",
-						{
+	        {
-							icon: icon
+	            north: b.getNorth(),
-						}
+	            south: b.getSouth(),
-					);
+	            east: b.getEast(),
+	            west: b.getWest()
+	        },
+	        function(pois) {
+	            poiLayer.clearLayers();
 
-					marker.bindTooltip(
+	            pois.forEach(function(poi) {
-						poi.name,
+	                var markerIcon = getMarkerIconFor(poi.type, currentZoom);
-						{
-							direction: "top",
-							offset: [0, -10],
-							opacity: 0.9,
-							className: "poi-tooltip"
-						}
-					);
 
-					marker.on(
+	                var marker = L.marker(
-						"click",
+	                    [poi.lat, poi.lon],
-						function() {
+	                    {
-							window.location =
+	                        icon: markerIcon
-								root +
+	                    }
-								"poi/" +
+	                );
-								poi.permalink;
-						}
-					);
 
-					poiLayer.addLayer(marker);
+	                marker.bindTooltip(
-				});
+	                    poi.name,
-			}
+	                    {
-		);
+	                        direction: "top",
+	                        offset: [0, -10],
+	                        opacity: 0.9,
+	                        className: "poi-tooltip"
+	                    }
+	                );
+
+	                marker.on("click", function() {
+	                    window.location = root + "poi/" + poi.permalink;
+	                });
+
+	                poiLayer.addLayer(marker);
+	            });
+	        }
+	    );
 	}
 
 	// ---------------------------------------------------------