0

I have a geoJSON layer having some attributes with "ID" as the primary key. I'm aiming to change the color of features within the geoJSON when ever a button is clicked.

So I'm making an ajax request and getting a JSON response from a FLASK based server but I'm unable to stylize the features based on the response from server. So ideally I want to do something like:

flaskResponse.ID == geoJSON.ID && flaskResponse.LOS == 'A'{
//change color of features with those IDs
}

I have tried using "eachLayer" function as indicated in another Stack Exchange post but that is working for the attributes within the GeoJSON only. Maybe because the JSON response from flask has "n" number of ID's and I'm making some error while looping.

I'm sharing my code below.

$(".sebtn").on("click",function(){
    $.ajax({
        method:"get",
        url:"/test",
        success:function(res){

            // console.log(res)

            rdNetworkLyr.eachLayer(function (layer) {
                for(let i=0; i<(Object.keys(res.XDSegID).length)+1){
                if(layer.feature.properties.XDSegID === res.XDSegID) {    
                  layer.setStyle({color :'black'}) 
                }}
              });
        }
    });

I'm also sharing the structure of response from Flask Server, incase I need to change that.

Flask Server JSON Response

1 Answer 1

1

This problem is not really GIS related, but purely JS related one, but anyway ...

When you try to iterate over object keys and get their values, you are always using the whole object res.XDSegID in comparison, not individual key values. The simplest way to iterate over the keys and get their values is for (const key in object) statement.

Relevant part of the code could then look something like this:

rdNetworkLyr.eachLayer(function (layer) {
  for (const key in res.XDSegID) {
    if (res.XDSegID.hasOwnProperty(key)) {
      if (layer.feature.properties.XDSegID === res.XDSegID[key]) {    
        layer.setStyle({color :'black'}) 
      }
    }
  }
});

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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