CODEWITHSUNDEEP
javascriptleaflet
DiamondJoe12
DiamondJoe12

Reputation: 1809

Filtering a geojson Layer in Leaflet not working

I have a geojson layer in leaflet that I wish to filter by year. This geojson layer was created from a geojson file, using pointToLayer.

The problem is, I'm not sure if this geoJsonLayer is an array? I am very confused about it's data structure, and thus, how to filter it. When I console.log it, the data is nested like so:

Object { options: Object, _layers: Object, _leaflet_id: 259, _initHooksCalled: true, _map: Object }

Clicking on _layers, I'm able to get a list of objects (these are the points I currently am seeing displayed on my map). If I click on one of the objects, I'm able to access a property called "Feature", which has a property called "Properties", which has a list of attributes:

info_city: Milwaukee

info_count: 1

info_date: 2002

This property called "info_date", is the field I want to filter by.

I've tried to unsuccessfully console.log the properties from geoJsonLayers.residents using geoJsonLayers.residents.features.properties.

I've tried to filter using:

function filterByYear(data, year) {
  f = data.filter(function(d) { 
    return d.properties.info_date == year;
  });
  return f;
}


filterByYear(geoJsonLayers.residents, 2009);

The problem is that I think the above method works for an array, but my data somehow seems to NOT be an a standard array once I converted my geojson file into a geoJsonLayer. It's also not a string/numeric issue because I've tried both options.

I've also tried something along the lines of:

var points = L.geoJson(geoJsonLayers.residents, {
            filter: function(feature, layer) {
                console.log(geoJsonLayers.residents)
                console.log(points)
                return feature.properties.info_date === 2010;
            }
        });

Upvotes: 1

Views: 1931

Answers (2)

ghybs
ghybs

Reputation: 53185

The L.geoJSON factory builds a Leaflet Layer Group object. It is definitely not a regular Array.

If you wish to get an array of the child layers in that Group, you can use points.getLayers(). You can also directly map them / apply a callback function on each child layer, by using points.eachLayer(cb) as shown in Aksav padwal's answer.

As you noticed, the L.geoJSON factory automatically added your GeoJSON data into the feature member of each child layer.

Now if you wish to filter the child layers so that you can display them or not on the map, you should rather build as many Layer Groups as necessary, possibly while the L.geoJSON factory is parsing your GeoJSON data, so that you can add to / remove from map those layer groups.

See: leaflet map, getting specific data of geojson file with button

Note that L.geoJSON option filter works only at instantiation or when adding data.

Upvotes: 1

Akshay
Akshay

Reputation: 805

try something like this

var arr = [];//this array to hold your filterred object
geoJsonLayers.eachLayer(function(layer){
if(layer.feature.properties.info_date === 2010){
arr.push(layer)
}
})

Upvotes: 1

Related Questions