Map: add google tiles and make it default

bluerobotics · Nov 21, 2024 · f4c38e1 · f4c38e1
1 parent 3d70e3c
commit f4c38e1
Showing 1 changed file with 9 additions and 1 deletion.
diff --git a/src/components/widgets/Map.vue b/src/components/widgets/Map.vue
@@ -161,9 +161,17 @@ const esri = L.tileLayer(
   { maxZoom: 19, attribution: '© Esri World Imagery' }
 )
 
+const google = L.tileLayer('http://{s}.google.com/vt/lyrs=s,h&x={x}&y={y}&z={z}', {
+  maxZoom: 23,
+  subdomains: ['mt0', 'mt1', 'mt2', 'mt3'],
+  maxNativeZoom: 22,
+  attribution: '© Google Maps',
+})
+
 const baseMaps = {
   'OpenStreetMap': osm,
   'Esri World Imagery': esri,
+  'Google Maps': google,
 }
 
 // Show buttons when the mouse is over the widget
@@ -190,7 +198,7 @@ watch(isMouseOver, () => {
 
 onMounted(async () => {
   // Bind leaflet instance to map element
-  map.value = L.map(mapId.value, { layers: [osm, esri], attributionControl: false }).setView(
+  map.value = L.map(mapId.value, { layers: [google, osm, esri], attributionControl: false }).setView(
     mapCenter.value as LatLngTuple,
     zoom.value
   ) as Map