Question

我在地图上聚集了标记，并且我的滑块使用的是名为nouislider的库。我正在使用它根据指定距离的范围显示某些标记。

我为标记工作了，但是对聚类标记没有运气。它正在删除我所有的群集标记，而不是对其进行过滤。我不确定该如何处理。如果有人可以指引我正确的方向，将不胜感激。

这是我的代码的链接。请记住，我无法在Jfiddle上显示滑块，并且在那里也出现错误-“ L.geoJson不是函数”

这是我的过滤器，它适用于标记，但不适用于聚类标记，我认为问题是我没有对聚类标记进行过滤，我不确定该怎么做。


        var slider = document.getElementById("slider");

        noUiSlider
          .create(slider, {
            start: [min + 1, max - 1],
            tooltips: true,
            connect: true,
            range: {
              min: min,
              max: max
            }
          })
          .on("slide", function(e) {
            console.log("e", e);
            surfSpotsGeoJSON.eachLayer(function(layer) {
              console.log("layer", layer);
              if (
                parseFloat(layer.feature.properties.distance) >=
                  parseFloat(e[0]) &&
                parseFloat(layer.feature.properties.distance) <=
                  parseFloat(e[1])
              ) {
                layer.addTo(map);
              } else {
                map.removeLayer(layer);
              }
            });
          });
      })
      .catch(err => console.log(err.message));
  }

Answer 1

您可能会对我的插件Leaflet.MarkerCluster.LayerSupport感兴趣：

Leaflet.markercluster插件的子插件（简称MCG）；带来与L.Control.Layers和其他Leaflet插件的兼容性。即使用直接调用import cv2 as cv import numpy as np from matplotlib import pyplot as plt img = cv.imread('img.PNG') img = cv.cvtColor(img, cv.COLOR_BGR2GRAY) histogram = np.zeros(256, dtype=np.uint8) for i in range(img.shape[0]): for j in range(img.shape[1]): for k in range(len(histogram)): if img[i][j] == k: histogram[k] += 1 plt.figure() plt.title('Gray Scale Histogram') plt.xlabel('gray scale value') plt.ylabel('pixels') plt.plot(histogram) plt.show()和map.addLayer的所有内容。

另请参阅How to use leaflet slider along with markercluster in Javascript?

以您为例，您将签入map.removeLayer Leaflet GeoJSON图层组，然后插件将负责其余的工作。

如何使用nouislider的滑块在Leaflet.js上过滤聚簇标记

1 个答案: