为Leaflet sideByside控件动态选择图层

Posted 2021-04-07

使用side-by-side.js我希望能够选择并排显示哪个图层组。我做了一个例子，我有两个layerGroups，我想将它们与control.layers选择器或jquery按钮并排传递，以便组中的一个层向左移动而另一个层到达对。我不确定从哪里开始。

https://jsfiddle.net/kaputkid/x8r0pvg1/21/

答案

只需提及所有Tile Layers，它们应该作为L.control.sideBySide()工厂第一个参数中的数组进入左窗格。

对于应该进入右窗格的所有图块层，它们应该作为数组列出并作为工厂的第二个参数传递。

然后，当这些图块层添加到地图上时（可能通过图层控件），并排插件会将它们放在正确的一半中。

L.control.sideBySide([
  Stamen_dark,
  OpenTopo_map
], [
  Stamen_watercolor,
  Esri_ocean
]).addTo(map);

更新了JSFiddle：https://jsfiddle.net/x8r0pvg1/22/