如何在传单中添加卫星视图？

Question

在我的网络应用程序中，我正在使用传单，我想使用图层切换将传单图层更改为卫星视图和其他地图视图。我该如何执行此操作。请帮忙！

Answer 1

你的问题需要更具体一点……也就是说，这样的事情可能会有所帮助。

var osm = L.tileLayer("http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"),
    mqi = L.tileLayer("http://{s}.mqcdn.com/tiles/1.0.0/sat/{z}/{x}/{y}.png", {subdomains: ['otile1','otile2','otile3','otile4']});

var baseMaps = {
    "OpenStreetMap": osm,
    "MapQuestImagery": mqi
};

var overlays =  {//add any overlays here

    };

L.control.layers(baseMaps,overlays, {position: 'bottomleft'}).addTo(map);

Answer 2

这是使用 arcgisonline.com 托管的 ESRI 图像地图的另一个解决方案。

在这里测试一下：

var map = L.map('map').setView([ 38.715755604432346, -9.141667043719174], 17);

var Esri_WorldImagery = L.tileLayer('https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
    attribution: 'Tiles © Esri — Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community'
}).addTo(map);

#map { height: 280px; }

 <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
     integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="
     crossorigin=""/>
 <script src="https://unpkg.com/[email protected]/dist/leaflet.js"
     integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo="
     crossorigin=""></script>

 <div id="map"></div>