From 14624a1207154fff629898ead2384ce80d6f903c Mon Sep 17 00:00:00 2001 From: ztimson Date: Sun, 8 Sep 2019 19:29:02 -0400 Subject: [PATCH] Added colored markers --- src/app/services/map.service.ts | 25 ++++++++++++++++++++----- src/assets/images/marker.png | Bin 4758 -> 0 bytes src/assets/images/measure.png | Bin 6090 -> 0 bytes 3 files changed, 20 insertions(+), 5 deletions(-) delete mode 100644 src/assets/images/marker.png delete mode 100644 src/assets/images/measure.png diff --git a/src/app/services/map.service.ts b/src/app/services/map.service.ts index 58dd191..7b77db7 100644 --- a/src/app/services/map.service.ts +++ b/src/app/services/map.service.ts @@ -24,10 +24,26 @@ export enum WeatherLayers { TEMP_NEW } +function buildMarker(color?: string) { + const markerHtmlStyles = ` + background-color: ${color || '#ff4141'}; + width: 3rem; + height: 3rem; + display: block; + left: -1.5rem; + top: -1.5rem; + position: relative; + border-radius: 3rem 3rem 0; + transform: rotate(45deg); + border: 2px solid #FFFFFF`; + return L.divIcon({className: "my-custom-pin", iconAnchor: [0, 24], labelAnchor: [-6, 0], popupAnchor: [0, -36], html: ``}); +} + + + const ARROW = L.icon({iconUrl: '/assets/images/arrow.png', iconSize: [40, 45], iconAnchor: [20, 23]}); const DOT = L.icon({iconUrl: '/assets/images/dot.png', iconSize: [25, 25], iconAnchor: [13, 13]}); -const MARKER = L.icon({iconUrl: '/assets/images/marker.png', iconSize: [40, 55], iconAnchor: [20, 55]}); -const MEASURE = L.icon({iconUrl: '/assets/images/measure.png', iconSize: [75, 50], iconAnchor: [25, 25]}); +const MARKER = buildMarker(); export class MapService { private readonly map; @@ -59,8 +75,6 @@ export class MapService { return ARROW; case 'dot': return DOT; - case 'measure': - return MEASURE; default: return MARKER; } @@ -114,7 +128,8 @@ export class MapService { } newMarker(m: Marker) { - let marker = L.marker(m.latlng, Object.assign({color: '#ff4141', autoPan: false}, m, {icon: m.icon ? this.getIcon(m.icon) : MARKER})).addTo(this.map); + let icon = m.icon ? m.icon : buildMarker(m.color); + let marker = L.marker(m.latlng, Object.assign({autoPan: false}, m, {icon: icon})).addTo(this.map); if(m.label) marker.bindTooltip(m.label, {permanent: true, direction: 'bottom'}); marker.on('click', e => this.click.next({latlng: {lat: e.latlng.lat, lng: e.latlng.lng}, symbol: m, item: marker})); if(!m.noDelete) this.markers.push(marker); diff --git a/src/assets/images/marker.png b/src/assets/images/marker.png deleted file mode 100644 index dada3e164d2ba741dd37cdbf7643fe19128e274c..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 4758 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 diff --git a/src/assets/images/measure.png b/src/assets/images/measure.png deleted file mode 100644 index ce035b70f306af2a4a0dd964c3ea8654dedc6363..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 6090 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 QvH$=807*qoM6N<$f@;v8Pyhe`