带有Google卫星图层的Leaflet Map API

Question

我对Leaflet Map API很感兴趣.

但是,我需要能够使用Google卫星图层.我无法找到有关如何将Google卫星图层添加到Leaflet的示例.我知道我仍然需要加载Google Maps API才能执行此操作(OpenLayers有一个示例).

Answer 1

您不需要插件或Google API,可以将其添加为XYZ切片图层.

街道

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

混合型:

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

卫星:

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

地形

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;

Answer 2

有一个第三方插件:演示:http://psha.org.ru/leaflet/bel.html(切换器切换到谷歌地图)来源:http://psha.org.ru/leaflet/Google .js文件

Answer 3

用于卫星层的 Google 地图 API 的替代方案：带有 Esri 世界图像图块的 Leaflet.js

<script>

    var map = L.map('map').setView([-41.2858, 174.78682], 14);

    var mapLink = '<a href="http://www.esri.com/">Esri</a>';
    var wholink = 'i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community';

    L.tileLayer(
        'http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
        attribution: '&copy; '+mapLink+', '+wholink,
        maxZoom: 18,
        }).addTo(map);

</script>

Answer 4

此存储库包含几个瓷砖图层谷歌和其他非常有用的其他插件:https: //github.com/shramov/leaflet-plugins

Answer 5

Leaflet 有一个用于发布所有可用插件的官方页面：http : //leafletjs.com/plugins.html

您会在那里找到用于向 Leaflet 添加 Google 图层支持的插件。