传单 layer.getbounds 不是函数答案

【问题标题】：leaflet layer.getbounds not a function传单 layer.getbounds 不是函数
【发布时间】：2018-02-23 19:03:37
【问题描述】：

我从 geoJson 中提取了一个要素图层，然后同步了一个表格。当我放大每个功能时，我试图做到这一点，它将表格过滤到这些功能。以下是我的脚本不起作用。我在 'if (map.getBounds().contains(layer.getBounds()))' 处收到错误，我可以寻求帮助吗？

var featureLayer = L.geoJson(null, {
  filter: function(feature, layer) {
    return feature.geometry.coordinates[0] !== 0 && feature.geometry.coordinates[1] !== 0;
  },
  pointToLayer: function (feature, latlng) {
    return L.marker(latlng, {
      title: feature.properties["status_title_github"],
      riseOnHover: true,
      icon: L.icon({
        iconUrl: "assets/pictures/markers/cb0d0c.png",
        iconSize: [30, 40],
        iconAnchor: [15, 32]
      })
    });
  },
  onEachFeature: function (feature, layer) {
    if (feature.properties) {
      layer.on({
        click: function (e) {
          identifyFeature(L.stamp(layer));
          highlightLayer.clearLayers();
          highlightLayer.addData(featureLayer.getLayer(L.stamp(layer)).toGeoJSON());
        },
        mouseover: function (e) {
          if (config.hoverProperty) {
            $(".info-control").html(feature.properties[config.hoverProperty]);
            $(".info-control").show();
          }
        },
        mouseout: function (e) {
          $(".info-control").hide();
        }
      });
      if (feature.properties["marker-color"]) {
        layer.setIcon(
          L.icon({
            iconUrl: "assets/pictures/markers/" + feature.properties["marker-color"].replace("#",'').toLowerCase() + ".png",
            iconSize: [30, 40],
            iconAnchor: [15, 32]
          })
        );
        legendItems[feature.properties.Status] = feature.properties["marker-color"];
      }
    }
  }
});




function syncTable() {
  tableFeatures = [];
  featureLayer.eachLayer(function (layer) {
    layer.feature.properties.leaflet_stamp = L.stamp(layer);
    if (map.hasLayer(featureLayer)) {
      if (map.getBounds().contains(layer.getBounds())) {
        tableFeatures.push(layer.feature.properties);
      }
    }
  });
  $("#table").bootstrapTable("load", JSON.parse(JSON.stringify(tableFeatures)));
  var featureCount = $("#table").bootstrapTable("getData").length;
  if (featureCount == 1) {
    $("#feature-count").html($("#table").bootstrapTable("getData").length + " visible feature");
  } else {
    $("#feature-count").html($("#table").bootstrapTable("getData").length + " visible features");
  }
}

【问题讨论】：

标签： leaflet

【解决方案1】：

您很可能正尝试在标记上getBounds。

您了解点要素不覆盖任何区域，因此没有理由尝试检索它们的“边界”。

在测试您的地图视口是否包含图层边界之前，请检查它是否是标记，即点类型特征

layer instanceof L.Marker

或者：

getLatLng in layer

或者因为您的图层来自 GeoJSON 数据并且是通过 L.geoJSON 工厂构建的：

layer.feature.geometry.type === "Point"

然后您可以以类似的方式检查该图层是否在您当前的地图视图端口中可见：

map.getBounds().contains(layer.getLatLng())

顺便说一句，对于其他（即非点类型）几何图形，我认为您可能更愿意检查它们的边界 intersects 地图视图端口，而不是完全包含在其中。

【讨论】：

做到了！没有意识到它不能做 getBounds。