Leaflet Map API with Google Satellite Layer

fnllc picture fnllc · Feb 22, 2012 · Viewed 80.2k times · Source

I'm very interested in the Leaflet Map API.

However, I need to be able to use the Google Satellite Layer. I have not been able to find an example on how to add a Google Satellite Layer to Leaflet. I understand that I will still need to load the Google Maps API to do this (OpenLayers has an example).

Answer

capie69 picture capie69 · Sep 4, 2015

You don't need a plugin or the Google API, you can add it as a XYZ tile layer.

Streets

googleStreets = L.tileLayer('http://{s}.google.com/vt/lyrs=m&x={x}&y={y}&z={z}',{
    maxZoom: 20,
    subdomains:['mt0','mt1','mt2','mt3']
});

Hybrid:

googleHybrid = L.tileLayer('http://{s}.google.com/vt/lyrs=s,h&x={x}&y={y}&z={z}',{
    maxZoom: 20,
    subdomains:['mt0','mt1','mt2','mt3']
});

Satellite:

googleSat = L.tileLayer('http://{s}.google.com/vt/lyrs=s&x={x}&y={y}&z={z}',{
    maxZoom: 20,
    subdomains:['mt0','mt1','mt2','mt3']
});

Terrain

googleTerrain = L.tileLayer('http://{s}.google.com/vt/lyrs=p&x={x}&y={y}&z={z}',{
    maxZoom: 20,
    subdomains:['mt0','mt1','mt2','mt3']
});


Note the difference in the "lyrs" parameter in the URL:
Hybrid: s,h;
Satellite: s;
Streets: m;
Terrain: p;