Question

我正在研究如何使用复选框，单选按钮或其他基于CSV文件中几列的选择器进行过滤。这个文件包含了我在地图上的所有要点和显示。我的过滤是我在努力的地方。我正在寻找一种比为每种类型的显示器创建单独的静态过滤器更好的方法。

我有csv文件我用Omnivore解析。

我可以这样过滤：

var freeLayer = L.geoJson(null, {
        filter: function(layer) {
            if (layer.properties.icon == "free")
                return true;
        }
    });
    var feeLayer = L.geoJson(null, {
        filter: function(layer) {
            if (layer.properties.icon == "fee")
                return true;
        }
    });

然后通过Omnivore加载我的图层：

var free = omnivore.csv('data/all.csv', null, freeLayer)...
var fee = omnivore.csv('data/all.csv', null, feeLayer)...

添加我的layerGroup：

var groupedOverlays = {
            "Fee Type": {
                "<img src='images/fee.png' width='26' height='26'>&nbsp;FEE": fee,
                "<img src='images/free.png' width='26' height='26'>&nbsp;FREE": free
            }...

这很好用，但是如果我想在我的csv文件中过滤另一个列/属性，我需要编写另一个L.geoJson过滤器。

如何更新图层属性以便一次使用两个或三个不同的选择？如果我有FREE和FEE的复选框，两者都显示，但两者都来自一个L.geoJson过滤器......

Answer 1

每个过滤器创建一个L.geoJson图层组没有任何问题。

主要缺点是您解析了相同CSV文件的多次，如果文件很大，可能会出现一些性能问题。

我认为您不能改变Leaflet-omnivore行为来创建多个组，但您可以使用L.geoJson或其他策略。

因此，一个简单的解决方法是使用L.geoJson构造函数的onEachFeature option将新创建的要素/标记添加到其他组（您的实际叠加层）中，具体取决于您需要的任何过滤器。然后，不需要将用于Omnivore的L.geoJson添加到地图中，它将仅作为中间容器。

替代策略将基于通过独立库替换Leaflet-omnivore。例如，CSV解析库（PapaParse ...），然后遍历每一行并自行构建功能/标记，直接在适当的覆盖层组中，具体取决于您的过滤器。这个策略也很容易实现，因为CSV具有简单的结构（与KML等其他格式相反，例如，Leaflet-omnivore闪耀）。

使用复选框等过滤传单标记Omivore CSV文件

1 个答案: