Deploying to gh-pages from @ CIMEngine/map@6439516bff 🚀

index.bundle.js

@@ -513,7 +513,7 @@
       console.log(
         `%c ${info} `,
         "color:white; background-color: #78d6fa; border-radius:10px;",
-        ...str
+        ...str,
       );
     }
     window.onload = async () => {
@@ -527,7 +527,7 @@
       let mapDataFromId = (
         await (
           await fetch(
-            `https://raw.githubusercontent.com/CIMEngine/MapList/main/index.json`
+            `https://raw.githubusercontent.com/CIMEngine/MapList/main/index.json`,
           )
         ).json()
       )[mapId];
@@ -563,7 +563,7 @@
             },
           ],
         }),
-        "top-left"
+        "top-left",
       );
 
       map.addControl(new ZoomControl(), "top-right");
@@ -577,7 +577,7 @@
           Crosshair: true,
           PrintableArea: true,
         }),
-        "top-right"
+        "top-right",
       );
 
       if (debug) {
@@ -592,7 +592,7 @@
           (error, image) => {
             if (error) throw error;
             map.addImage("city", image);
-          }
+          },
         );
 
         map.loadImage(
@@ -601,7 +601,7 @@
             if (error) throw error;
             map.addImage("capital-city", image);
             map.addImage("capital", image);
-          }
+          },
         );
 
         map.loadImage(
@@ -609,7 +609,7 @@
           (error, image) => {
             if (error) throw error;
             map.addImage("landmark-0", image);
-          }
+          },
         );
 
         let lasticocords;
@@ -626,16 +626,6 @@
           data: geoURL,
         });
 
-        map.addLayer({
-          id: "map-data-fill",
-          type: "fill",
-          source: "map-data",
-          paint: {
-            "fill-color": ["get", "fill"],
-            "fill-opacity": ["coalesce", ["get", "fill-opacity"], 0.3],
-          },
-        });
-
         map.addLayer({
           id: "map-data-fill-outline",
           type: "line",
@@ -647,6 +637,16 @@
           },
         });
 
+        map.addLayer({
+          id: "map-data-fill",
+          type: "fill",
+          source: "map-data",
+          paint: {
+            "fill-color": ["get", "fill"],
+            "fill-opacity": ["coalesce", ["get", "fill-opacity"], 0.3],
+          },
+        });
+
         map.addLayer({
           id: "map-data-symbol",
           type: "symbol",
@@ -683,35 +683,31 @@
               .setLngLat(coordinates)
               .setHTML(
                 `
-                ${
-                  feature?.properties?.amount
+                ${feature?.properties?.amount
               ? `<div class="row glass" style="color: "white";"><div class="col">Population - ${feature.properties.amount} people.</div></div>`
               : ""
             }
                 <div class="row" style="padding: 5px;">
-                  ${
-                    feature?.properties?.img
+                  ${feature?.properties?.img
               ? `<div class="col-md-12 col-sm-12" style="padding: 0px;"><img class="w-100 about-img" src="${feature.properties.img}" alt="${feature.properties.name} img"></div>`
               : ""
             }
                   <div class="col-md-12 col-sm-12 text-center glass mb-2">
                     <h5 className="card-title">${feature.properties.name}
-                      ${
-                        feature.properties.name_ru
+                      ${feature.properties.name_ru
               ? ` - ${feature.properties.name_ru}`
               : ""
             }
                     </h5>
                   </div>
-                  ${
-                    feature.properties.description
+                  ${feature.properties.description
               ? `<div class="col-md-12 col-sm-12 text-center glass"><div>${converter.makeHtml(
-                          feature.properties.description
+                feature.properties.description,
               )}</div></div>`
               : ""
             }
                 </div>
-                `
+                `,
               )
               .addTo(map);
           } else if (
@@ -730,8 +726,7 @@
                       `
                     <div class="row" style="padding: 5px;">
                             <div class="col-12 col-sm-12" style="padding: 0px;">
-                                    <img class="w-100 about-img" src="${
-                                      country.img
+                                    <img class="w-100 about-img" src="${country.img
                   }">
                             </div>
                             <div class="col-12 text-center glass">
@@ -741,17 +736,16 @@
                             </div>
                             <div class="col-12 text-center glass"> 
                                   ${JSON.parse(
-                                    feature.properties.tags || "[]"
+                    feature.properties.tags || "[]",
                   ).join(", ")}
                             </div>
                             <div class="col-12 text-center glass"> 
                                 Founding date: ${country.date}
                             </div>
                             <div class="col-md-12 col-sm-12 text-center glass">
-                              ${
-                                country.description
+                              ${country.description
                     ? `<div>${converter.makeHtml(
-                                      country.description
+                      country.description,
                     )}</div>`
                     : ""
                   }
@@ -760,13 +754,12 @@
                                 Area: ${feature.properties.area} km²
                             </div>
                             <div class="col-12 text-center mt-2">
-                              ${
-                                country.about
+                              ${country.about
                     ? `<a href="${country.about}" class="about">About</a>`
                     : ""
                   }
                             </div>
-                    </div>`
+                    </div>`,
                     )
                     .addTo(map);
             }, 1);