diff --git a/assets/js/rover_map_hook.ts b/assets/js/rover_map_hook.ts index 4ef3e6ee..0acc3c6f 100644 --- a/assets/js/rover_map_hook.ts +++ b/assets/js/rover_map_hook.ts @@ -19,6 +19,7 @@ interface RoverMapHook extends ViewHook { map: L.Map osmLayer: L.TileLayer topoLayer: L.TileLayer | null + satelliteLayer: L.TileLayer hillshadeLayer: L.TileLayer layersControl: L.Control.Layers stations: Station[] @@ -116,6 +117,10 @@ export const RoverMap: Partial = { this.topoLayer = L.tileLayer("https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png", { maxZoom: 17 }) + this.satelliteLayer = L.tileLayer( + "https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}", + { maxZoom: 19 } + ) this.hillshadeLayer = L.tileLayer( "https://services.arcgisonline.com/ArcGIS/rest/services/Elevation/World_Hillshade/MapServer/tile/{z}/{y}/{x}", { maxZoom: 16, opacity: 0.45 } @@ -125,7 +130,7 @@ export const RoverMap: Partial = { this.hillshadeLayer.addTo(map) this.layersControl = L.control.layers( - { "OSM": this.osmLayer, "Topo": this.topoLayer }, + { "OSM": this.osmLayer, "Topo": this.topoLayer, "Satellite": this.satelliteLayer }, { "Hillshade": this.hillshadeLayer, "Grid squares": this.gridLayer }, { position: "topright" } ).addTo(map)