Take the 2-minute tour ×
Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. It's 100% free, no registration required.

I am struggling with geojson popups in leaflet.js I have nested arrays as properties for my features - an example would be counts of fish caught at a location (not my actual project data!)

{"type":"FeatureCollection",
"features":[{"geometry":{"type":"Point",
"coordinates":[-122.679416,
45.516632]},
"type":"Feature",
"properties":{"fisher_id":"401",
"river":"Willamette",
"fishcaught":[{"type":"Salmon",
"count":5},
{"type":"Sturgen",
"count":1},
{"type":"Bass",
"count":2}]}},
{"geometry":{"type":"Point",
"coordinates":[-121.318584,
44.050165]},
"type":"Feature",
"properties":{"fisher_id":"401",
"river":"Deschutes",
"fishcaught":[{"type":"Trout",
"count":10},
{"type":"Whitefish",
"count":1}]}},
{"geometry":{"type":"Point",
"coordinates":[-124.102962,
43.983057]},
"type":"Feature",
"properties":{"fisher_id":"401",
"river":"Siuslaw",
"fishcaught":[{"type":"Steelhead",
"count":2},
{"type":"Salmon",
"count":6}]}},
{"geometry":{"type":"Point",
"coordinates":[-121.776289,
42.220382]},
"type":"Feature",
"properties":{"fisher_id":"401",
"river":"Klamath",
"fishcaught":[{"type":"Trout",
"count":3},
{"type":"Steelhead",
"count":2},
{"type":"Salmon",
"count":3}]}}]}

I am trying to put a popup on each feature (onEachFeature) that states river and a count of each type caught.

I'm binding using a function like this

function onEachFeature(feature, layer) {
        if (feature.properties.fishcaught) {
            var popupcontent;
            popupcontent = "<span style='font-weight:bold'>River: </span>"+feature.properties.river
            for (i=0;i<feature.properties.fishcaught.length;i=i+1){
                var fishstring = "<br><span style='font-weight:bold'>"+feature.properties.fishcaught[i].type+": </span>"
                +feature.properties.fishcaught[i].count
                popupcontent = popupcontent+fishstring;
            }
            layer.bindPopup(popupcontent);
        }
    }

geojson = L.geoJson(inData, {
    onEachFeature: onEachFeature
}).addTo(map);

The problem is that the onEachFeature is caught in an endless loop. If I remove the for loop from the function, everything works fine.

Any thoughts on this?

share|improve this question
1  
What happens if you put a semi-colon after your popupcontent = "... lines? Does the debug console say anything? Canyou set up a jsfiddle of this so that we can edit it? –  alexgleith Oct 22 '13 at 22:19
    
Thanks for the fiddle request. Of course, the fiddle works fine, and I have long since moved past this issue! Marking my question answered so others might see the code. Cheers! –  abenrob Mar 3 at 21:16
add comment

2 Answers 2

It looks like you have a typo in your for loop. It should be:

for (i=0;i<feature.properties.fishcaught.length;i++)

instead of:

for (i=0;i<feature.properties.fishcaught.length;i=i+1)

Notice that the first is incrementing i by one not adding 1 to i.

share|improve this answer
    
i++ and i=i+1 and i+=1 all do the same thing. I come from a python background,so often default to the latter 2... jsfiddle.net/abenrob/qHXUM –  abenrob Jan 5 '13 at 17:43
add comment
up vote 0 down vote accepted

For whatever it is worth, when I revisited this, and build the fiddle (http://jsfiddle.net/abenrob/28vwV/) it now works... (thanks @alexgleith for the nudge!)

Marking complete so others might see the code.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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