wind view checkbox

package-lock.json

@@ -12,7 +12,9 @@
 				"bootstrap-icons": "^1.11.3",
 				"js-cookie": "^3.0.5",
 				"leaflet": "^1.9.4",
-				"leaflet-velocity": "^2.1.4"
+				"leaflet-heatmap": "^1.0.0",
+				"leaflet-velocity": "^2.1.4",
+				"leaflet.heat": "^0.2.0"
 			},
 			"devDependencies": {
 				"@sveltejs/adapter-auto": "^4.0.0",
@@ -1053,6 +1055,11 @@
 				"node": "^8.16.0 || ^10.6.0 || >=11.0.0"
 			}
 		},
+		"node_modules/heatmap.js": {
+			"version": "2.0.5",
+			"resolved": "https://registry.npmjs.org/heatmap.js/-/heatmap.js-2.0.5.tgz",
+			"integrity": "sha512-CG2gYFP5Cv9IQCXEg3ZRxnJDyAilhWnQlAuHYGuWVzv6mFtQelS1bR9iN80IyDmFECbFPbg6I0LR5uAFHgCthw=="
+		},
 		"node_modules/import-meta-resolve": {
 			"version": "4.1.0",
 			"resolved": "https://registry.npmjs.org/import-meta-resolve/-/import-meta-resolve-4.1.0.tgz",
@@ -1093,11 +1100,25 @@
 			"resolved": "https://registry.npmjs.org/leaflet/-/leaflet-1.9.4.tgz",
 			"integrity": "sha512-nxS1ynzJOmOlHp+iL3FyWqK89GtNL8U8rvlMOsQdTTssxZwCXh8N2NB3GDQOL+YR3XnWyZAxwQixURb+FA74PA=="
 		},
+		"node_modules/leaflet-heatmap": {
+			"version": "1.0.0",
+			"resolved": "https://registry.npmjs.org/leaflet-heatmap/-/leaflet-heatmap-1.0.0.tgz",
+			"integrity": "sha512-WP/emZYwjWaEnWMcE2dftuJvtjp53zmJcHtVTHUqPN7AQEowHxDTLH5j1BJjE4uL1K5dJclBLX4oLpnOGS/qTw==",
+			"dependencies": {
+				"heatmap.js": "*",
+				"leaflet": "*"
+			}
+		},
 		"node_modules/leaflet-velocity": {
 			"version": "2.1.4",
 			"resolved": "https://registry.npmjs.org/leaflet-velocity/-/leaflet-velocity-2.1.4.tgz",
 			"integrity": "sha512-uTmSb2/Kn28S0itlmJBMy2ZRKsisWUr2wm9rtkKXjpq9Sai7tqKdTRHKfLgTOgEdWFf5Ctt2bQoB7kb50qC7eg=="
 		},
+		"node_modules/leaflet.heat": {
+			"version": "0.2.0",
+			"resolved": "https://registry.npmjs.org/leaflet.heat/-/leaflet.heat-0.2.0.tgz",
+			"integrity": "sha512-Cd5PbAA/rX3X3XKxfDoUGi9qp78FyhWYurFg3nsfhntcM/MCNK08pRkf4iEenO1KNqwVPKCmkyktjW3UD+h9bQ=="
+		},
 		"node_modules/locate-character": {
 			"version": "3.0.0",
 			"resolved": "https://registry.npmjs.org/locate-character/-/locate-character-3.0.0.tgz",

package.json

@@ -25,6 +25,8 @@
 		"bootstrap-icons": "^1.11.3",
 		"js-cookie": "^3.0.5",
 		"leaflet": "^1.9.4",
-		"leaflet-velocity": "^2.1.4"
+		"leaflet-heatmap": "^1.0.0",
+		"leaflet-velocity": "^2.1.4",
+		"leaflet.heat": "^0.2.0"
 	}
 }

src/routes/WindVisualisation.svelte

@@ -92,6 +92,7 @@
         if (legend) map.removeControl(legend);
         
         // Создаем слой векторов ветра
+        if (showVectors) {
             velocityLayer = L.velocityLayer({
                 displayValues: true,
                 displayOptions: {
@@ -101,19 +102,44 @@
                 },
                 data: windData
             }).addTo(map);
+        }
         
         // Создаем тепловую карту
+        if (showHeatmap) {
             const heatData = prepareHeatData(windData);
             heatLayer = createHeatLayer(heatData);
             
             if (heatLayer) {
                 heatLayer.addTo(map);
                 createLegend(Math.max(...heatData.map(point => point[2])));
-        } else {
-        console.warn("Heat layer was not created");
             }
+        }
+
+        // Обновляем контроль слоев
+        updateLayerControl();
     };
 
+    const updateLayerControl = () => {
+        if (layerControl) {
+            map.removeControl(layerControl);
+        }
+        
+        const baseLayers = {};
+        const overlays = {};
+        
+        if (velocityLayer) {
+            overlays['Векторы ветра'] = velocityLayer;
+        }
+        
+        if (heatLayer) {
+            overlays['Тепловая карта'] = heatLayer;
+        }
+        
+        layerControl = L.control.layers(null, overlays, {
+            collapsed: false,
+            position: 'topright'
+        }).addTo(map);
+    };
     // Создание легенды с учетом максимальной скорости
     const createLegend = (maxSpeed) => {
         if (!map) return;
@@ -162,7 +188,41 @@
         updateLayers();
     };
 </script>
+<div class="layer-controls">
+    <div class="control-group">
+        <label>
+            <input type="checkbox" bind:checked={showHeatmap}> Тепловая карта
+        </label>
+        <label>
+            <input type="checkbox" bind:checked={showVectors}> Векторы ветра
+        </label>
+    </div>
+</div>
 <style>
+    .layer-controls {
+        position: absolute;
+        bottom: 30px;
+        left: 10px;
+        z-index: 1000;
+        background: rgba(255, 255, 255, 0.8);
+        padding: 10px;
+        border-radius: 5px;
+        box-shadow: 0 0 10px rgba(0,0,0,0.2);
+    }
+    
+    .control-group {
+        display: flex;
+        flex-direction: column;
+        gap: 5px;
+    }
+    
+    .control-group label {
+        display: flex;
+        align-items: center;
+        gap: 5px;
+        font-size: 14px;
+        cursor: pointer;
+    }
     .wind-heat-legend {
         padding: 8px 10px;
         background: rgba(255, 255, 255, 0.9);