0

Here is what my site looks like: https://brandonlprice.github.io/landrecords/. How can I access the feature properties for a layer when running a find or a query on a layer? I have the the feature.properties.length being displayed in a .innerhtml to show the total count of features returned. I also would like to be able to display the individual attributes for each feature in a layer in a .innerhtml when they are clicked on in the map. The onEachFeature would be one way although I do not know how to link that to the query.run or find.run. How can I do that? Are there any other way to access the individual attributes. My query snippet are below.

Query:

function tmqueryFunction() {
     latlng = markerLayer.getLatLng();
     tmbufferResult.clearLayers();
document.getElementById("tractcounts").innerHTML = '';
    if (document.getElementById("tm1").checked == true){
       tmquery.nearby(latlng, distance);
       tmquery.run(function (error, featureCollection, response) {
  if (error) {
    console.log(error);
    return;
  }
  tmbufferResult.addData(featureCollection).addTo(map)
  document.getElementById('tractcounts').innerHTML = 'Tract Map Records: ' + 
  featureCollection.features.length;      
  });  
  map.fitBounds(L.geoJSON(featureCollection).getBounds());
});
}
}
2
  • When I run your code/site, I get error markerLayer is not defined at line 388.
    – TomazicM
    Dec 1, 2020 at 21:21
  • I am aware. It is a global variable issue. It still works for now. Do you have an idea how I can access the individual feature properties for each layer?
    – brandon p
    Dec 2, 2020 at 0:34

1 Answer 1

0

You can access feature properties by iterating through layers/features with .eachLayer method. Feature properties are accessible through layer feature property.

In your case, if you would want to attach popup with some of the feature properties to each layer/feature, your code could look something like this:

function tmqueryFunction() {
  if (!markerLayer) return;
  
  latlng = markerLayer.getLatLng();
  tmbufferResult.clearLayers();
  document.getElementById("tractcounts").innerHTML = '';

  if (!document.getElementById("tm1").checked) return;

  tmquery.nearby(latlng, distance);
  tmquery.run(function (error, featureCollection, response) {
    if (error) {
      console.log(error);
      return;
    }
    tmbufferResult.addData(featureCollection).addTo(map)
    document.getElementById('tractcounts').innerHTML = 'Tract Map Records: ' + featureCollection.features.length;  
    tmbufferResult.eachLayer(function(layer) {
      layer.bindPopup(
        'REFERENCE: ' + layer.feature.properties.REFERENCE + '<br>' +
        'SUB_NAME: ' + layer.feature.properties.SUB_NAME);
    });

    map.fitBounds(L.geoJSON(featureCollection).getBounds());
  });
}

Here is an example of such popup on your map:

enter image description here

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.