second map

templates/index.html

@@ -176,6 +176,16 @@
                         <!-- <canvas id="myChart" style="width:80%;max-width:400px; margin-left: 20px;"></canvas> -->
                     </div> 
                 </div>
+                <section>
+                    <div class="map-container">
+                        <iframe
+                        src=""
+                        width="100%"
+                        height="800px"
+                        frameborder="0">
+                        </iframe>
+                    </div>
+                </section>
             </div>
         </div>
     </div>
@@ -248,7 +258,16 @@
                     }
                     
                     currentLayer = L.geoJSON(data, {
-                        style: { color: "blue", weight: 2 },
+                        style: function (feature) {
+                            return {
+                                color: "white",
+                                weight: 1,
+                                //dashArray: '5, 10',
+                                opacity: 1,
+                                fillOpacity: 0.4,
+                                fillColor: '#32CD32'
+                            };
+                        },
                         onEachFeature: function (feature, layer) {
                             let clickTimer = null;
                             layer.on('click', async function (e) {
@@ -864,6 +883,23 @@
             for (var i = 0; i < 7; i++) dataArray.push(Math.round(Math.random() * 100));
             return dataArray;
         }
+
+        function getColorByStatus(value) {
+            return value > 15 ? '#006400' :  // dark green
+                value > 12 ? '#32CD32' :  // lime green
+                value > 10 ? '#ADFF2F' :  // green-yellow
+                value > 8  ? '#FFFF00' :  // yellow
+                value > 5  ? '#FFA500' :  // orange
+                            '#44704BFF';    // red
+        }
+        
+        function getColorByValue(val) {
+            return val > 200 ? '#18D814' :
+                val > 100 ? '#50AF1C' :
+                val > 60 ? '#888523' :
+                val > 10 ? '#C05C2B' :
+                            '#F73232';
+        }
         
         
         window.onload = function(){