CODEWITHSUNDEEP
javascriptjqueryjsonjvectormap
user1278673
user1278673

Reputation:

jQuery jVector Map onRegionClick show associated info

I am using jquery and this plugin. This is what i currently have(actual question at the bottom):

so far i have the following code:

    var properties = [];
    jQuery.each(json['properties'],function(k,v){
        properties.push({
            name:v.name,
            status:v.status,
            color:v.color,
            size:v.size,
            price:v.price
        });
    });
    console.log(properties);

which for the getJson it returns:

{
    "land": {
        "Long Land": {
            "path": "M541.421,195.072 156.67,423.574 7.16,321.971 428.509,14.837 639.505,78.824 715.519,62.551 696.101,102.448 484.892,100.685 238.629,265.688 298.41,338.024 540.763,194.308 526.509,170.217 747.15,108.014 780.865,164.098 611.146,314.125",
            "name": "Long Land"
        }
    },
    "properties": {
        "unit 1": {
            "path": "M541.421,195.072 156.67,423.574 428.509,14.837 639.505",
            "name": "unit 1",
            "status": "Available",
            "color": "#244df0",
            "size": "3200",
            "price": "300 000"
        }
    }
}

and then for the console.log(properties) i get a object with the following:

color "#244df0"

name "unit 1"

price "300 000"

size "3200"

status "Available"

and then i init jvectormap:

    //START JVECTORMAP
    jQuery('#twinvalley-map').vectorMap({
        map: 'twin_valley',
        normalizeFunction: 'polynomial',
        backgroundColor: false,
        onRegionClick:function (event, code, region){
            console.log(code);
        }
    });
    //START JVECTORMAP

then finally for the onRegionClick console.log() i get the same name as in both previous logs.. 'unit 1'.

So Now my question, How would i get the rest of the data on region click? by data i mean:

color "#244df0"

name "unit 1"

price "300 000"

size "3200"

status "Available"

Any Help Greatly Appreciated.

Upvotes: 0

Views: 1494

Answers (1)

Ruben
Ruben

Reputation: 5095

Try using the code as the index:

onRegionClick:function (event, code, region){
        console.log('Name: ' + json['properties'][code]['name'] + ', color: ' + json['properties'][code]['color']);
    }

Upvotes: 1

Related Questions