传单控制层:选择器

时间:2018-10-11 09:03:05

标签: javascript leaflet

我在传单上显示了两个Geojson文件。这两个文件在我的地图上都显示良好,但我希望能够使选择器在两层上都起作用。

如您在此处看到的,我的选择器仅显示在省份:here

var ward = [];
var wardOverlay = L.d3SvgOverlay(function(sel, proj) {

  var upd = sel.selectAll('path').data(ward);
  upd.enter()
    .append('path')
    .attr('d', proj.pathFromGeojson)
    .attr('stroke', 'red')
    .attr('fill-opacity', '0.2');
  upd.attr('stroke-width', 1 / proj.scale);
});


var province = [];
var provinceOverlay = L.d3SvgOverlay(function(sel, proj) {

  var upd = sel.selectAll('path').data(province);
  upd.enter()
    .append('path')
    .attr('d', proj.pathFromGeojson)
    .attr('stroke', 'black')
    .attr('fill-opacity', '0.1');
  upd.attr('stroke-width', 1 / proj.scale);
}); 

L.control.layers({"Geo Tiles": tiles}, {"province": provinceOverlay}, {"ward": wardOverlay}).addTo(map);



d3.json("ward.geo.json", function(data) { ward = data.features; wardOverlay.addTo(map) });
d3.json("province.geo.json", function(data) { province = data.features; provinceOverlay.addTo(map) });  


</script>

</body>
</html>

如何为两层都有一个选择器?

1 个答案:

答案 0 :(得分:1)

看看salt.states.saltmod.state的创建:

  

L.control.layers(<Object> baselayers?, <Object> overlays?, <Control.Layers options> options?)

     

使用给定的图层创建归因控件。基本层将通过单选按钮进行切换,而覆盖层将通过复选框进行切换。 [...]

这意味着第二个对象包含每个可切换层的条目。试试:

L.control.layers({"Geo Tiles": tiles}, {
    "province": provinceOverlay, 
    "ward": wardOverlay
}).addTo(map);