首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >jquery / leaflet问题 - 使用复选框而不是L.control在小册子中使用叠加地图

jquery / leaflet问题 - 使用复选框而不是L.control在小册子中使用叠加地图
EN

Stack Overflow用户
提问于 2018-06-01 05:15:31
回答 1查看 0关注 0票数 0

我正在尝试使用复选框来使用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: &copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>, <a href="http://viewfinderpanoramas.org">SRTM</a> | Map style: &copy; <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;

    }
  });
 });
EN

回答 1

Stack Overflow用户

发布于 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);
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/-100004699

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档