如何避免 leaflet javascript 库中多个 MultiPolygon GeoJSON 层重叠？

Question

我正在写一个网站来显示城市地图上的不同等时线： http://130.192.68.210:8080/citychrone/citychrone.html

我的基于 Leafletjs 库的项目中有多个 MultiPolygon GeoJSON 层。我希望当一层与另一层重叠时，在重叠区域中只能看到其中的一层。该图层的每个图层的不透明度都小于 1，因此不足以设置图层在地图上的顺序。我想知道是否可以优先考虑图层，所以当它们重叠时，只有一个是可见的。 另一种可能是让一层成为另一层的"hole"，有可能吗？

Answer 1

Turfjs 非常适合在 Javascript.

中进行这样的几何运算

在您的情况下，您可以使用 turf-erase http://turfjs.org/static/docs/module-turf_erase.html 在多边形的 "erasing" 部分创建孔洞。该页面上的示例显示了类似于您想要执行的操作。