Skip to content
Snippets Groups Projects
Commit 07abcf5b authored by kyro's avatar kyro Committed by Benguria Elguezabal, Gorka
Browse files

Fix layers descriptions and markers in 'Map Layers' Component

parent af09c05b
Branches
No related tags found
No related merge requests found
......@@ -41,3 +41,4 @@ testem.log
Thumbs.db
debug.log
src/app/pages/simulation-wizard/single-map-jsi/single-map-jsi.component.ts
......@@ -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",
......
......@@ -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) {
......
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/img/markers/layers-2x.png

1.23 KiB

src/assets/img/markers/layers.png

696 B

src/assets/img/markers/marker-icon-2x.png

2.53 KiB

src/assets/img/markers/marker-icon.png

1.43 KiB

src/assets/img/markers/marker-shadow.png

618 B

[{"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"
}
]
......@@ -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",
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment