diff --git a/angular.json b/angular.json index 9f4effd..265669e 100644 --- a/angular.json +++ b/angular.json @@ -39,6 +39,7 @@ "./node_modules/leaflet-openweathermap/leaflet-openweathermap.js", "./node_modules/leaflet-rotatedmarker/leaflet.rotatedMarker.js", "./node_modules/leaflet-bing-layer/leaflet-bing-layer.js", + "./node_modules/leaflet.gridlayer.googlemutant/Leaflet.GoogleMutant.js", "./node_modules/esri-leaflet/dist/esri-leaflet.js", "./src/assets/js/leaflet.Editable.js", "./node_modules/jquery/dist/jquery.js" diff --git a/package.json b/package.json index c39be6f..3f33f1e 100644 --- a/package.json +++ b/package.json @@ -38,6 +38,7 @@ "leaflet-openweathermap": "^1.0.0", "leaflet-polylinedecorator": "^1.6.0", "leaflet-rotatedmarker": "^0.2.0", + "leaflet.gridlayer.googlemutant": "^0.8.0", "lodash": "^4.17.15", "momentjs": "^2.0.0", "ng-click-outside": "^5.0.0", diff --git a/src/app/services/map.service.ts b/src/app/services/map.service.ts index b186385..f4d7446 100644 --- a/src/app/services/map.service.ts +++ b/src/app/services/map.service.ts @@ -7,6 +7,10 @@ declare const L; export enum MapLayers { BING, + GOOGLE_HYBRID, + GOOGLE_ROAD, + GOOGLE_SATELLITE, + GOOGLE_TERRAIN, ESRI_TOPOGRAPHIC, ESRI_IMAGERY, ESRI_IMAGERY_CLARITY @@ -156,11 +160,23 @@ export class MapService { setMapLayer(layer?: MapLayers) { if(this.mapLayer) this.map.removeLayer(this.mapLayer); - if(layer == null) layer = MapLayers.BING; + if(layer == null) layer = MapLayers.GOOGLE_HYBRID; switch(layer) { case MapLayers.BING: this.mapLayer = L.tileLayer.bing(environment.bing); break; + case MapLayers.GOOGLE_HYBRID: + this.mapLayer = L.gridLayer.googleMutant({type: 'hybrid'}); + break; + case MapLayers.GOOGLE_ROAD: + this.mapLayer = L.gridLayer.googleMutant({type: 'roadmap'}); + break; + case MapLayers.GOOGLE_SATELLITE: + this.mapLayer = L.gridLayer.googleMutant({type: 'satellite'}); + break; + case MapLayers.GOOGLE_TERRAIN: + this.mapLayer = L.gridLayer.googleMutant({type: 'terrain'}); + break; case MapLayers.ESRI_TOPOGRAPHIC: this.mapLayer = L.esri.basemapLayer('Topographic'); break; diff --git a/src/app/views/map/map.component.ts b/src/app/views/map/map.component.ts index d3fd003..cec17cd 100644 --- a/src/app/views/map/map.component.ts +++ b/src/app/views/map/map.component.ts @@ -55,7 +55,11 @@ export class MapComponent implements OnDestroy, OnInit { {name: 'Place Relative', icon: 'control_camera', click: this.placeRelative}, {name: 'Delete', icon: 'delete', toggle: true, onEnabled: this.startDelete, onDisabled: this.unsub}, {name: 'Map Style', icon: 'terrain', subMenu: [ - {name: 'Bing:Satellite', toggle: true, enabled: true, click: () => this.map.setMapLayer(MapLayers.BING)}, + {name: 'Bing:Satellite', toggle: true, click: () => this.map.setMapLayer(MapLayers.BING)}, + {name: 'Google:Hybrid', toggle: true, enabled: true, click: () => this.map.setMapLayer(MapLayers.GOOGLE_HYBRID)}, + {name: 'Google:Road', toggle: true, click: () => this.map.setMapLayer(MapLayers.GOOGLE_ROAD)}, + {name: 'Google:Satellite', toggle: true, click: () => this.map.setMapLayer(MapLayers.GOOGLE_SATELLITE)}, + {name: 'Google:Terrain', toggle: true, click: () => this.map.setMapLayer(MapLayers.GOOGLE_TERRAIN)}, {name: 'ESRI:Topographic', toggle: true, click: () => this.map.setMapLayer(MapLayers.ESRI_TOPOGRAPHIC)}, {name: 'ESRI:Satellite', toggle: true, click: () => this.map.setMapLayer(MapLayers.ESRI_IMAGERY)}, {name: 'ESRI:Satellite Clear', toggle: true, click: () => this.map.setMapLayer(MapLayers.ESRI_IMAGERY_CLARITY)} diff --git a/src/environments/environment.prod.ts b/src/environments/environment.prod.ts index c4baa8d..5dee680 100644 --- a/src/environments/environment.prod.ts +++ b/src/environments/environment.prod.ts @@ -9,6 +9,7 @@ export const environment = { messagingSenderId: "443222036375", appId: "1:443222036375:web:2e2906e3ca49aa63" }, + googleMaps: 'AIzaSyDFtvCY6nH_HUoTBNf_5b-E8nRweSLYtxE', openWeather: 'e8391af54b6fc09dc82b019fc68b8409', production: true }; diff --git a/src/environments/environment.ts b/src/environments/environment.ts index 9de4cbf..3825efa 100644 --- a/src/environments/environment.ts +++ b/src/environments/environment.ts @@ -13,6 +13,7 @@ export const environment = { messagingSenderId: "443222036375", appId: "1:443222036375:web:2e2906e3ca49aa63" }, + googleMaps: 'AIzaSyDFtvCY6nH_HUoTBNf_5b-E8nRweSLYtxE', openWeather: 'e8391af54b6fc09dc82b019fc68b8409', production: false }; diff --git a/src/index.html b/src/index.html index df78e7e..e2c558d 100644 --- a/src/index.html +++ b/src/index.html @@ -27,6 +27,8 @@ + +