Fix layers descriptions and markers in 'Map Layers' Component

.gitignore

@@ -41,3 +41,4 @@ testem.log
 Thumbs.db
 
 debug.log
+src/app/pages/simulation-wizard/single-map-jsi/single-map-jsi.component.ts

angular.json

@@ -47,7 +47,8 @@
               "node_modules/leaflet-timedimension/dist/leaflet.timedimension.control.css",
               "node_modules/leaflet.awesome-markers/dist/leaflet.awesome-markers.css",
               "node_modules/leaflet.markercluster/dist/MarkerCluster.Default.css",
-              "node_modules/leaflet-draw/dist/leaflet.draw.css"
+              "node_modules/leaflet-draw/dist/leaflet.draw.css",
+              
             ],
             "scripts": [
               "node_modules/pace-js/pace.min.js",

src/app/pages/map-layers/map/map.component.ts

@@ -138,6 +138,20 @@ export class MapComponent implements OnInit {
       console.log("CHARGE LAYER-> " + clickedLayerName)
       if (clickedLayerName !== "Bilbao Sound") {
         this.map.addLayer(geojsonLayer);
+
+        //pointToLayer icon
+        geojsonLayer.eachLayer((layer: L.Layer) => {
+          if (layer instanceof L.Marker) {
+            layer.setIcon(L.icon({
+              iconUrl: 'assets/img/markers/marker-icon.png',
+              iconSize: [25, 41],
+              iconAnchor: [12, 41],
+              popupAnchor: [1, -34],
+              shadowSize: [41, 41]
+            }));
+          }
+        });
+
         this.map.fitBounds(geojsonLayer.getBounds(), {
           padding: [50, 50]
         });
@@ -180,29 +194,37 @@ export class MapComponent implements OnInit {
 
   }
 
-  public getLayer(title, l): L.GeoJSON {
-    let layer = L.geoJSON(l,
-      {
+  icon = new L.Icon({
+    iconSize: [25, 41],
+    iconAnchor: [13, 41],
+    iconUrl: 'assets/img/markers/marker-icon.png',
+    iconRetinaUrl: 'assets/img/markers/marker-icon-2x.png',
+    shadowUrl: 'assets/img/markers/marker-shadow.png'
+  });
+
+  public getLayer(title: string, l) {
+    let layer = L.geoJSON(l, {
       onEachFeature: (feature, layer) => {
-          let text = "";
-          for (let p in feature.properties) {
-            text += `${p}: ${feature.properties[p]}\n`;
-          }
-          layer.bindPopup(text);
+        layer.bindPopup(this.getPopupContent(title, feature))
       },
-        style: function () {
-          if (title == '2020')
-            return { color: '#248175', weight: 7, opacity: 0.8 }
-          else
-            return { color: "#880808", weight: 5, opacity: 0.8 }
+    });
+    return layer;
   }
-      },
-    )
-      .on('popupclose', ($event) => {
-      })
 
-    layer['_id'] = title;
-    return layer;
+  // Bind icons 
+  public getPopupContent(title: string, feature) {
+    let content = "<h3>" + title + "</h3>";
+    if (feature.properties) {
+      for (var p in feature.properties) {
+        content += "<p>" + p + ": " + feature.properties[p] + "</p>";
+      }
+    }
+
+    if(feature.coordinates) {
+      content += "<p>Coordinates: " + feature.coordinates + "</p>";
+    }
+
+    return content;
   }
 
   getLegendColor(v: number) {

src/app/pages/simulation-wizard/simulations/simulations.module.ts

 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { LeafletComponent } from '../../maps/leaflet/leaflet.component'
 import { MapsModule } from '../../maps/maps.module'
 
 @NgModule({
-  declarations: [LeafletComponent],
+  declarations: [],
   imports: [
     CommonModule,
     MapsModule

src/assets/map/map-component-maps/messina_cycling_paths.json

-[{"id":"urn:ngsi-ld:GtfsShape:messina:CyclingPaths:CRS84:1","alternateName":"CyclingPaths","description":"Pista ciclabile Messina - Dinnamare","location":{"coordinates":[[15.5612754821777,38.2057461528513],[15.5396461486816,38.2137042649229],[15.5279731750488,38.2217626526206],[15.5256128311157,38.2283031144339],[15.5229520797729,38.2282019777484],[15.5219650268555,38.2273928792016],[15.5218362808228,38.2263140671392],[15.5210638046265,38.2264152064497],[15.5202054977417,38.2273254539165],[15.5213642120361,38.2298538593357],[15.5227375030518,38.2319439414548],[15.5241537094116,38.2345058956597],[15.5190896987915,38.229449320375],[15.5154848098755,38.2247969606063],[15.5132102966309,38.2201780192588],[15.5113220214844,38.217716711774],[15.5091762542725,38.218289900406],[15.5061721801758,38.2153227575021],[15.5024814605713,38.2124566523255],[15.5002498626709,38.2096241551407],[15.49720287323,38.2074322661897],[15.4951858520508,38.2059484885141],[15.4920101165771,38.1995746449794],[15.4849290847778,38.1928629579669],[15.4799938201904,38.1879046813689],[15.4727840423584,38.1738375293672],[15.4648876190186,38.1668198052653],[15.4643297195435,38.1587890805601]],"type":"LineString"},"name":"Messina - Dinnamare","type":"GtfsShape","@context":["https:\/\/smartdatamodels.org\/context.jsonld","https:\/\/uri.etsi.org\/ngsi-ld\/v1\/ngsi-ld-core-context.jsonld"],"dateCreated":"2022-10-14T09:39:09.016Z","dateModified":"2022-10-14T09:39:09.016Z"}, {"id":"urn:ngsi-ld:GtfsShape:messina:CyclingPaths:CRS84:2","alternateName":"CyclingPaths","description":"Pista ciclabile Messina - Centro","location":{"coordinates":[[15.556404590607,38.197247547181],[15.55163025856,38.189414124437],[15.552043318749,38.189178012077],[15.552424192429,38.188967197626],[15.552581101656,38.189100010947],[15.552727282047,38.188996711505],[15.552932471037,38.188906060766],[15.553153753281,38.188773246963],[15.553459525108,38.188596161463],[15.55367410183,38.188478104766],[15.555133223534,38.19032059499],[15.556321442127,38.191861615525],[15.556497126818,38.19204186355],[15.556568875909,38.192110906863],[15.556604750454,38.192143320436],[15.556640625,38.192142005046],[15.557144880295,38.19711264068],[15.556860566139,38.197175878031],[15.556436777115,38.197289705411],[15.556404590607,38.197247547181]],"type":"LineString"},"name":"Messina - Centro","type":"GtfsShape","@context":["https:\/\/smartdatamodels.org\/context.jsonld","https:\/\/uri.etsi.org\/ngsi-ld\/v1\/ngsi-ld-core-context.jsonld"],"dateCreated":"2022-10-14T09:39:09.024Z","dateModified":"2022-10-14T09:39:09.024Z"}, {"id":"urn:ngsi-ld:GtfsShape:messina:CyclingPaths:CRS84:3","alternateName":"CyclingPaths","location":{"coordinates":[[15.565814,38.218324],[15.5655241012573,38.2208523355462],[15.5656099319458,38.2223020944011],[15.5667686462402,38.2248306744285],[15.5687856674194,38.226920900893],[15.56960105896,38.2284379631292],[15.5700302124023,38.2298201478416],[15.5710601806641,38.2329552499491],[15.5720043182373,38.2344721863219],[15.5731201171875,38.2355171685269],[15.5760169029236,38.2369497810148],[15.5778193473816,38.2380115814698],[15.5783772468567,38.2375059641392],[15.5791068077087,38.2379441660288]],"type":"LineString"},"name":"Messina - Litoranea","type":"GtfsShape","@context":["https:\/\/smartdatamodels.org\/context.jsonld","https:\/\/uri.etsi.org\/ngsi-ld\/v1\/ngsi-ld-core-context.jsonld"],"dateCreated":"2022-10-14T09:39:09.028Z","dateModified":"2022-10-14T09:39:09.028Z"}]
+[
\ No newline at end of file
+  {
+    "id": "urn:ngsi-ld:GtfsShape:messina:CyclingPaths:CRS84:1",
+    "alternateName": "CyclingPaths",
+    "description": "Pista ciclabile Messina - Dinnamare",
+    "location": {
+      "coordinates": [
+        [15.5612754821777, 38.2057461528513],
+        [15.5396461486816, 38.2137042649229],
+        [15.5279731750488, 38.2217626526206],
+        [15.5256128311157, 38.2283031144339],
+        [15.5229520797729, 38.2282019777484],
+        [15.5219650268555, 38.2273928792016],
+        [15.5218362808228, 38.2263140671392],
+        [15.5210638046265, 38.2264152064497],
+        [15.5202054977417, 38.2273254539165],
+        [15.5213642120361, 38.2298538593357],
+        [15.5227375030518, 38.2319439414548],
+        [15.5241537094116, 38.2345058956597],
+        [15.5190896987915, 38.229449320375],
+        [15.5154848098755, 38.2247969606063],
+        [15.5132102966309, 38.2201780192588],
+        [15.5113220214844, 38.217716711774],
+        [15.5091762542725, 38.218289900406],
+        [15.5061721801758, 38.2153227575021],
+        [15.5024814605713, 38.2124566523255],
+        [15.5002498626709, 38.2096241551407],
+        [15.49720287323, 38.2074322661897],
+        [15.4951858520508, 38.2059484885141],
+        [15.4920101165771, 38.1995746449794],
+        [15.4849290847778, 38.1928629579669],
+        [15.4799938201904, 38.1879046813689],
+        [15.4727840423584, 38.1738375293672],
+        [15.4648876190186, 38.1668198052653],
+        [15.4643297195435, 38.1587890805601]
+      ],
+      "type": "LineString"
+    },
+    "name": "Messina - Dinnamare",
+    "type": "GtfsShape",
+    "@context": [
+      "https://smartdatamodels.org/context.jsonld",
+      "https://uri.etsi.org/ngsi-ld/v1/ngsi-ld-core-context.jsonld"
+    ],
+    "dateCreated": "2022-10-14T09:39:09.016Z",
+    "dateModified": "2022-10-14T09:39:09.016Z"
+  },
+  {
+    "id": "urn:ngsi-ld:GtfsShape:messina:CyclingPaths:CRS84:2",
+    "alternateName": "CyclingPaths",
+    "description": "Pista ciclabile Messina - Centro",
+    "location": {
+      "coordinates": [
+        [15.556404590607, 38.197247547181],
+        [15.55163025856, 38.189414124437],
+        [15.552043318749, 38.189178012077],
+        [15.552424192429, 38.188967197626],
+        [15.552581101656, 38.189100010947],
+        [15.552727282047, 38.188996711505],
+        [15.552932471037, 38.188906060766],
+        [15.553153753281, 38.188773246963],
+        [15.553459525108, 38.188596161463],
+        [15.55367410183, 38.188478104766],
+        [15.555133223534, 38.19032059499],
+        [15.556321442127, 38.191861615525],
+        [15.556497126818, 38.19204186355],
+        [15.556568875909, 38.192110906863],
+        [15.556604750454, 38.192143320436],
+        [15.556640625, 38.192142005046],
+        [15.557144880295, 38.19711264068],
+        [15.556860566139, 38.197175878031],
+        [15.556436777115, 38.197289705411],
+        [15.556404590607, 38.197247547181]
+      ],
+      "type": "LineString"
+    },
+    "name": "Messina - Centro",
+    "type": "GtfsShape",
+    "@context": [
+      "https://smartdatamodels.org/context.jsonld",
+      "https://uri.etsi.org/ngsi-ld/v1/ngsi-ld-core-context.jsonld"
+    ],
+    "dateCreated": "2022-10-14T09:39:09.024Z",
+    "dateModified": "2022-10-14T09:39:09.024Z"
+  },
+  {
+    "id": "urn:ngsi-ld:GtfsShape:messina:CyclingPaths:CRS84:3",
+    "alternateName": "CyclingPaths",
+    "location": {
+      "coordinates": [
+        [15.565814, 38.218324],
+        [15.5655241012573, 38.2208523355462],
+        [15.5656099319458, 38.2223020944011],
+        [15.5667686462402, 38.2248306744285],
+        [15.5687856674194, 38.226920900893],
+        [15.56960105896, 38.2284379631292],
+        [15.5700302124023, 38.2298201478416],
+        [15.5710601806641, 38.2329552499491],
+        [15.5720043182373, 38.2344721863219],
+        [15.5731201171875, 38.2355171685269],
+        [15.5760169029236, 38.2369497810148],
+        [15.5778193473816, 38.2380115814698],
+        [15.5783772468567, 38.2375059641392],
+        [15.5791068077087, 38.2379441660288]
+      ],
+      "type": "LineString"
+    },
+    "name": "Messina - Litoranea",
+    "type": "GtfsShape",
+    "@context": [
+      "https://smartdatamodels.org/context.jsonld",
+      "https://uri.etsi.org/ngsi-ld/v1/ngsi-ld-core-context.jsonld"
+    ],
+    "dateCreated": "2022-10-14T09:39:09.028Z",
+    "dateModified": "2022-10-14T09:39:09.028Z"
+  }
+]

src/assets/map/map-component-maps/messina_pois.json

@@ -3749,30 +3749,9 @@
             {
                 "type": "Feature",
                 "properties": {
-                    "stopId": 694,
-                    "stopCode": 694,
-                    "stopName": "Paradiso; via C. Pompea - Poste",
-                    "mainStop": true,
-                    "type": "bus",
-                    "year": "2021"
-                },
-                "geometry": {
-                    "type": "Point",
-                    "coordinates": [
-                        15.5685009397998,
-                        38.2265999624069
-                    ]
-                }
-            },
-            {
-                "type": "Feature",
-                "properties": {
-                    "stopId": 695,
-                    "stopCode": 695,
-                    "stopName": "Contemplazione; via C. Pompea n. 239",
-                    "mainStop": true,
-                    "type": "bus",
-                    "year": "2021"
+                    "name": "Casa di Riposo",
+                    "category": "Medical Service",
+                    "type": "Medical_Facility"
                 },
                 "geometry": {
                     "type": "Point",