传单使用卫星图像，drupal 8？
传单使用卫星图像，drupal 8？
提问于 2017-04-06 10:22:16
我需要的不是传单中的基本视图(这是一张世界地图)，而是卫星图像，但我仍然需要能够在它们之间切换吗？这是怎么回事，有人能给我解释一下吗？
已安装的模块：
回答 2
Stack Overflow用户
回答已采纳
发布于 2017-06-06 09:18:41
我做了一个更详细的例子，我的问题，但@JulienV接近我的意思，但这并不完全是我想要的，而且我已经找到了他的确切答案在另一篇文章。我想知道的是如何在视图中添加或多或少的地图：
var osmLink = '<a href=\"https://openstreetmap.org\">OpenStreetMap</a>',
thunLink = '<a href=\"https://thunderforest.com/\">Thunderforest</a>';
var osmUrl = 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
osmAttrib = '© ' + osmLink + ' Contributors',
landUrl = 'https://{s}.tile.thunderforest.com/landscape/{z}/{x}/{y}.png',
thunAttrib = '© '+osmLink+' Contributors & '+thunLink;
var osmMap = L.tileLayer(osmUrl, {attribution: osmAttrib}),
landMap = L.tileLayer(landUrl, {attribution: thunAttrib});
var roadmap = L.tileLayer('https://{s}.google.com/vt/lyrs=m&x={x}&y={y}&z={z}',{
maxZoom: 20,
subdomains:['mt0','mt1','mt2','mt3']
});
var satellite = L.tileLayer('https://{s}.google.com/vt/lyrs=s&x={x}&y={y}&z={z}',{
maxZoom: 20,
subdomains:['mt0','mt1','mt2','mt3']
});
var sat_text = L.tileLayer('https://{s}.google.com/vt/lyrs=s,h&x={x}&y={y}&z={z}',{
maxZoom: 20,
subdomains:['mt0','mt1','mt2','mt3']
});然后，我将每个地图添加到数组中，如下所示：
if($map_layouts['get_roads']) {
$roads = "\"Roads\": roadmap";
if($baselist == "") {
$baselist = $roads;
} else {
$baselist = $baselist . "," . $roads;
}
}然后，我需要检查$baselist是否是空的：
if($baselist) {
$base_layout = "var baseLayers = {".$baselist."};";
} else {
$base_layout = "";
}然后，当然将这些层添加到地图中：
L.control.layers(baseLayers).addTo(map);我计算出了包含google maps的代码。osm和thun映射是一个很好的例子，但基本上这段代码所做的是：
- 首先，我在
if中使用php语句来查看道路是否包括在我所做的按钮中。我在数组中传递get_roads，以便if语句返回true，然后将$roads设置为roadmap值，这个值在这个答案的第一个代码中在map examples中给出。 - 然后，我检查
$baselist是否是空的，因为如果它是空的，它不需要一个,，但是如果它不是空的，那么它就会得到$baselist，这是以前的设置值，然后是逗号，然后是新的值。 - 这是层的标记，然后我将把
baseLayers作为这些值传递，如果选中按钮，它将在leaflet视图中创建映射。
Stack Overflow用户
发布于 2017-04-06 19:47:53
无需使用任何外部插件：
gpxpod.map = new L.Map('map', {
zoomControl: true
});
var osmUrl = 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
var osmAttribution = 'Map data © 2013 <a href="http://openstreetmap'+
'.org">OpenStreetMap</a> contributors';
var osm = new L.TileLayer(osmUrl, {maxZoom: 18, attribution: osmAttribution});
var esriAerialUrl = 'https://server.arcgisonline.com/ArcGIS/rest/services'+
'/World_Imagery/MapServer/tile/{z}/{y}/{x}';
var esriAerialAttrib = 'Tiles © Esri — Source: Esri, i-cubed, '+
'USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the'+
' GIS User Community';
var esriAerial = new L.TileLayer(esriAerialUrl,
{maxZoom: 18, attribution: esriAerialAttrib});
var gUrl = 'http://mt0.google.com/vt/lyrs=s&x={x}&y={y}&z={z}';
var gAttribution = 'google';
var googlesat = new L.TileLayer(gUrl, {maxZoom: 18, attribution: gAttribution});
var baseLayers = {
'OpenStreetMap': osm,
'ESRI Aerial': esriAerial,
'Google map sat': googlesat
}
L.control.layers(baseLayers, {}).addTo(map);这段代码添加了一个标准控件，用于在平铺提供程序层之间切换。它包括两个卫星瓦供应商。
更多信息：http://leafletjs.com/reference-1.0.3.html#control-layers
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/43252401
复制相关文章
相似问题
腾讯云开发者
