2

Below is my demand.js file containing my geojson data:

var campus = {
    "type":"FeatureCollection",
    "features": [
        {
            "type": "Feature",     
            "id":"03",
            "properties": {
                "name": "ANG MO KIO",        
                "demand":"30"
            },
            "geometry": {
                "type": "MultiPolygon",
                "coordinates": [[[
                [103.866,1.37152],[103.862,1.36902],[103.861,1.36761],
                [103.858,1.36139],[103.858,1.36041],[103.857,1.35777],
                [103.856,1.35518],[103.856,1.35398],[103.856,1.35231],
                [103.855,1.35202],[103.854,1.3542],[103.852,1.35624],
                [103.849,1.35865],[103.845,1.3623],[103.844,1.36289],
                [103.842,1.36318],[103.84,1.36335],[103.837,1.36402],
                [103.835,1.36497],[103.831,1.36737],[103.831,1.36843],
                [103.831,1.36926],[103.832,1.36942],[103.832,1.37001],
                [103.832,1.37062],[103.833,1.37112],[103.833,1.3716],
                [103.833,1.3723],[103.833,1.37436],[103.834,1.3759],
                [103.834,1.37613],[103.835,1.37681],[103.835,1.37684],
                [103.836,1.37798],[103.834,1.381],[103.835,1.38121],
                [103.835,1.3814],[103.835,1.38167],[103.836,1.38199],
                [103.837,1.38406],[103.839,1.38606],[103.843,1.38912],
                [103.845,1.39041],[103.846,1.39135],[103.848,1.39194],
                [103.849,1.3922],[103.85,1.39244],[103.85,1.38615],
                [103.85,1.38403],[103.849,1.38206],[103.848,1.38064],
                [103.848,1.37963],[103.848,1.379],[103.848,1.37854],
                [103.849,1.37788],[103.852,1.37726],[103.855,1.37695],
                [103.857,1.37718],[103.861,1.37839],[103.863,1.37881],
                [103.866,1.37889],[103.867,1.3787],[103.868,1.37834],
                [103.872,1.37663],[103.869,1.37614],[103.869,1.37564],
                [103.867,1.37429],[103.867,1.37276],[103.866,1.37152]
                ]]]
            } 
        }
    ]
};

function setDemand(id, newdemand) {   
    for (var i=0; i<campus.length;i++) {
        if (campus[i].features.id > id) {
            campus[i].features.properties.demand = newdemand;
            return;
        } else {
            campus[i].features.properties.demand = newdemand+100;
        }     
    }    
}

The setDemand function is called when the select button is triggered:

<select onchange="setDemand(10,1000)">

But it does not work - the properties do not change. I am new to geoJSON/JSON.

2 Answers 2

3

Note that campus is not an array, so you can not do

campus[i]

Instead, campus is a plain javascript object with a features property which is an array, so you can do

campus.features[i]

In order to change a property of the i-th feature in a GeoJSON FeatureCollection, just

campus.features[i].properties.demand = newValue;

Your original question had a syntax error in the GeoJSON (an additional set of brackets). If you're new to GeoJSON and you are writing the GeoJSON structures by yourself, please use a tool like http://geojsonlint.com/ to make sure that the structures are valid.

6
  • I edited the code and ran the exact function but still the change is not happening
    – joker
    Dec 1, 2016 at 10:01
  • What "change" is not happening? How are you checking that it's not happening? Dec 1, 2016 at 10:11
  • function getColor(d) { return d > 1000 ? '#4CA64C' : d > 500 ? '#6fdc6f' : d > 200 ? '#6fdc6f' : d > 100 ? '#6fdc6f' : d > 50 ? '#6fdc6f' : d > 20 ? '#6fdc6f' : d > 10 ? '#6fdc6f' : '#FFEDA0'; } This code changes the color of each polygon according to it's demand properties
    – joker
    Dec 1, 2016 at 12:11
  • The properties of the GeoJSON are changing - this does not mean that values depending on the GeoJSON properties change automatically Dec 1, 2016 at 12:36
  • no they do not change automatically.I trigger the map update functions to update the map according to the new properties.
    – joker
    Dec 1, 2016 at 12:59
1

Your syntax is wrong,Try to use any HTML Editor Tool. You have additional bracket :

var campus = {
    "type": "FeatureCollection", "features": [{      
        "type": "Feature", "id": "03",
        "properties": {
            "name": "ANG MO KIO", "demand": "30"
        },
        "geometry": {
            "type": "MultiPolygon",
            "coordinates": [
                [
                    [
                  [103.866, 1.37152], [103.862, 1.36902], [103.861, 1.36761], [103.858, 1.36139], [103.858, 1.36041], [103.857, 1.35777], [103.856, 1.35518], [103.856, 1.35398], [103.856, 1.35231], [103.855, 1.35202], [103.854, 1.3542], [103.852, 1.35624], [103.849, 1.35865], [103.845, 1.3623], [103.844, 1.36289], [103.842, 1.36318], [103.84, 1.36335], [103.837, 1.36402], [103.835, 1.36497], [103.831, 1.36737], [103.831, 1.36843], [103.831, 1.36926], [103.832, 1.36942], [103.832, 1.37001], [103.832, 1.37062], [103.833, 1.37112], [103.833, 1.3716], [103.833, 1.3723], [103.833, 1.37436], [103.834, 1.3759], [103.834, 1.37613], [103.835, 1.37681], [103.835, 1.37684], [103.836, 1.37798], [103.834, 1.381], [103.835, 1.38121], [103.835, 1.3814], [103.835, 1.38167], [103.836, 1.38199], [103.837, 1.38406], [103.839, 1.38606], [103.843, 1.38912], [103.845, 1.39041], [103.846, 1.39135], [103.848, 1.39194], [103.849, 1.3922], [103.85, 1.39244], [103.85, 1.38615], [103.85, 1.38403], [103.849, 1.38206], [103.848, 1.38064], [103.848, 1.37963], [103.848, 1.379], [103.848, 1.37854], [103.849, 1.37788], [103.852, 1.37726], [103.855, 1.37695], [103.857, 1.37718], [103.861, 1.37839], [103.863, 1.37881], [103.866, 1.37889], [103.867, 1.3787], [103.868, 1.37834], [103.872, 1.37663], [103.869, 1.37614], [103.869, 1.37564], [103.867, 1.37429], [103.867, 1.37276], [103.866, 1.37152]
                    ]
                ]
            ]
        }
    }]
};

function setDemand(id, newdemand) {
    for (var i = 0; i < campus.length; i++) {
        if (campus.features[i].id > id) {
            campus.features[i].properties.demand = newdemand;
            return;
        }

        else {
            campus.features[i].properties.demand = newdemand + 100;
        }
    }
}
2
  • can u specify where?I tried with an HTML editor but both seems same
    – joker
    Dec 1, 2016 at 9:11
  • @IvanSanchez fixed the code already, check the Edited
    – Shiko
    Dec 1, 2016 at 9:13

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.