leaflet layer.getbounds not a function - leaflet

Question

I have a feature layer pull from geoJson and then syncing a table. I'm trying to make it when I zoom in on eachFeature, it filters the table to those features. Below is my script that is not working. I'm getting the error at 'if (map.getBounds().contains(layer.getBounds()))' Can I get some help?
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");
}
}

Answer 1

Most probably you are trying to getBounds on a marker.
You understand that point features do not cover any area, therefore there should be no reason to try retrieving their "bounds".
Before testing if your map viewport contains the layer bounds, check whether it is a Marker or not, i.e. a point type feature
layer instanceof L.Marker
Or:
getLatLng in layer
Or since your layers come from GeoJSON data and are built through L.geoJSON factory:
layer.feature.geometry.type === "Point"
Then you can check if that layer is visible in your current map view port in a similar way:
map.getBounds().contains(layer.getLatLng())
BTW for other (i.e. non point type) geometries, I think you would probably prefer checking if their bounds intersects the map view port, rather than is completely contained within.