Question

我想制作一张地图，我会在其右上方有三个类别，如厕所，垃圾箱和医院。我使用QGIS开源映射创建了一个地图图层。

这是我的代码，我只创建了一个类别。

var baseMaps = {'OSM': basemap0};
    L.control.layers(baseMaps,{'<img src="legend/sampletoiletsurvey0.png" /> TOILETS': sampleJSON,},{collapsed:false},{autoZIndex :true}).addTo(map);
    L.control.layers(null, overlays).addTo(map);

现在我想在它下面有两个类别。对于纬度和经度，我有geojson文件。如何使用leaflet.js中的图层组功能创建其他两个类别？

Answer 1

首先，存储对要添加项目的L.Control.Layers实例的引用。

var myLayersControl = L.control.layers(null, overlays).addTo(map);

然后从网络中异步获取geojson文件...

fetch('http://wherever/stuff.geojson')

...完成后，获取网络响应的json表示，并为其创建L.GeoJson的实例...

fetch('http://wherever/stuff.geojson')
.then(function(response){
    return response.json();
})
.then(function(jsonData){
    var geoJsonLayer = L.geoJson(jsonData);
});

...将其添加到地图中......

.then(function(jsonData){
    var geoJsonLayer = L.geoJson(jsonData).addTo(map);
});

...最后，将新创建的L.GeoJSON实例添加到图层控件中：

.then(function(jsonData){
    var geoJsonLayer = L.geoJson(jsonData).addTo(map);
    myLayersControl.addOverlay(geoJsonLayer, "Stuff!!");
});

如果有任何混淆，请记住RTFM：

如果您尝试异步加载多个数据并且它们以任意顺序出现，那么请阅读：

{{3}}

如何在地图右上方有三个类别的leaflet.js中添加多个叠加图层？

1 个答案: