我正在尝试使用复选框来使用jquery覆盖我的小册子web地图中的不同地图。我似乎无法让“叠加地图”显示在已存在的底图上。我对jquery很新。我正在使用一个,只是为了测试,但没有工作
<div id= "layercontrol" >
<input type="checkbox" id= "layercontrol2">Topo Map<br />
<input type="checkbox" id= "layercontrol3">Satellite<br />
</div>
var OpenTopoMap =
L.tileLayer('https://{s}.tile.opentopomap.org/{z}/{x}/{y}.png', {
maxZoom: 17,
attribution: 'Map data: © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>, <a href="http://viewfinderpanoramas.org">SRTM</a> | Map style: © <a href="https://opentopomap.org">OpenTopoMap</a> (<a href="https://creativecommons.org/licenses/by-sa/3.0/">CC-BY-SA</a>)'
}).addTo(map);
$(document).ready(function(){
$("#layercontrol2").change(function(){
if($(this).prop("checked")){
OpenTopoMap.addTo(map);
return;
}else {
OpenTopoMap.remove();
return;
}
});
});
发布于 2018-06-01 14:32:03
var mymap;
mymap = L.map('mapid').setView([41.87194, 12.567379999999957], 6.4);
//toggle map output displayed
//Ceates tile Layer using mapbox and imports api image sytle from the mapbox
website
var map_box =
L.tileLayer('HTTP MAP1', {
}).addTo(mymap);
var map_box2 = L.tileLayer('HTTP Map2', {
});
var basemaps = {
'Map Box': map_box,
'Map Box Alternative': map_box2
};
L.control.layers(basemaps, {}, {collapsed: false}).addTo(mymap);
https://stackoverflow.com/questions/-100004699
复制相似问题