Leaflet初体验0x5 图层组和图层控件

最新推荐文章于 2025-05-30 09:08:24 发布

原创

最新推荐文章于 2025-05-30 09:08:24 发布 · 1.7k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#Layer Groups #Layers Control #Leaflet #图层组 #图层控件

本文介绍了如何在Leaflet中使用图层组进行多图层管理，并通过图层控件让用户自由切换图层。内容涵盖了图层组的概念与应用，以及图层控件的实现和自定义样式技巧。

利用图层组将多个图层组织一起，利用图层控件可以实现让用户切换图层。

图层组

//直接添加到地图
var lgdYL = L.marker([42.046488, 121.655045]).bindPopup('这里是辽工大玉龙校区！').addTo(mymap),
	lgdXH = L.marker([42.02137, 121.659164]).bindPopup('这里是辽工大细河校区！').addTo(mymap);

//直接添加到地图
var lgdYL = L.marker([42.046488, 121.655045]).bindPopup('这里是辽工大玉龙校区！'),
	lgdXH = L.marker([42.02137, 121.659164]).bindPopup('这里是辽工大细河校区！');
//添加到新建的图层组
var schools = L.layerGroup([lgdYL,lgdXH]).addTo(mymap);

图层控件

//创建覆盖图层
var schools = L.layerGroup();
//创建标注并添加到覆盖图层schools
L.marker([42.046488, 121.655045]).bindPopup('这里是辽工大玉龙校区！').addTo(schools),
L.marker([42.02137, 121.659164])