nested json in backboneJS view

Question

I have this json as follow

[
 {
    "name":"River In 1", 
    "lat": 3.277801, 
    "lng": 101.681199,
    y: 55.11,
    drilldown: {
        data: [{"x":1.3722048e+12,"y":72.21},
                     {"x":1.3722057e+12,"y":67.84},
                     {"x":1.3722066e+12,"y":71.47},
                     {"x":1.3722075e+12,"y":71.22},
                     {"x":1.3722084e+12,"y":69.84},
                     {"x":1.3722093e+12,"y":65.19},
                     {"x":1.3722102e+12,"y":75.35},
                     {"x":1.3722111e+12,"y":75.32},
                     {"x":1.372212e+12,"y":70.31},
                     {"x":1.3722129e+12,"y":68.84},
                     {"x":1.3722138e+12,"y":66.19}]
    }   
},
{
    "name":"River In 2", 
    "lat": 3.272488, 
    "lng": 101.685491,
    y: 21.63,
    drilldown: {
        data: [{"x":1.3722048e+12,"y":72.21},
                     {"x":1.3722057e+12,"y":67.84},
                     {"x":1.3722066e+12,"y":71.47},
                     {"x":1.3722075e+12,"y":71.22},
                     {"x":1.3722084e+12,"y":69.84},
                     {"x":1.3722093e+12,"y":65.19},
                     {"x":1.3722102e+12,"y":75.35},
                     {"x":1.3722111e+12,"y":75.32},
                     {"x":1.372212e+12,"y":70.31},
                     {"x":1.3722129e+12,"y":68.84},
                     {"x":1.3722138e+12,"y":66.19}]
    }
},
{
    "name":"Ext River 1", 
    "lat": 3.288770, 
    "lng": 101.695583,
    y: 11.94,
    drilldown: {
            data: [{"x":1.3722048e+12,"y":72.21},
                         {"x":1.3722057e+12,"y":67.84},
                         {"x":1.3722066e+12,"y":71.47},
                         {"x":1.3722075e+12,"y":71.22},
                         {"x":1.3722084e+12,"y":69.84},
                         {"x":1.3722093e+12,"y":65.19},
                         {"x":1.3722102e+12,"y":75.35},
                         {"x":1.3722111e+12,"y":75.32},
                         {"x":1.372212e+12,"y":70.31},
                         {"x":1.3722129e+12,"y":68.84},
                         {"x":1.3722138e+12,"y":66.19}]
    }
},
{
    "name":"Ext River 2", 
    "lat": 3.284699, 
    "lng": 101.691960,
    y: 7.15,
    drilldown: {
            data: [{"x":1.3722048e+12,"y":72.21},
                         {"x":1.3722057e+12,"y":67.84},
                         {"x":1.3722066e+12,"y":71.47},
                         {"x":1.3722075e+12,"y":71.22},
                         {"x":1.3722084e+12,"y":69.84},
                         {"x":1.3722093e+12,"y":65.19},
                         {"x":1.3722102e+12,"y":75.35},
                         {"x":1.3722111e+12,"y":75.32},
                         {"x":1.372212e+12,"y":70.31},
                         {"x":1.3722129e+12,"y":68.84},
                         {"x":1.3722138e+12,"y":66.19}]
    }       
},
{
    "name":"Ext River 3", 
    "lat": 3.273645, 
    "lng": 101.690136,
    y: 2.14,
    drilldown: {
        data: [{"x":1.3722048e+12,"y":72.21},
                     {"x":1.3722057e+12,"y":67.84},
                     {"x":1.3722066e+12,"y":71.47},
                     {"x":1.3722075e+12,"y":71.22},
                     {"x":1.3722084e+12,"y":69.84},
                     {"x":1.3722093e+12,"y":65.19},
                     {"x":1.3722102e+12,"y":75.35},
                     {"x":1.3722111e+12,"y":75.32},
                     {"x":1.372212e+12,"y":70.31},
                     {"x":1.3722129e+12,"y":68.84},
                     {"x":1.3722138e+12,"y":66.19}]
    }
}
]

and i refer to this and no solution satisfied my level of knowledge about backboneJS.

Normally i used to get it like model.get('name') but couldn't get the nested item/object. Anyone can help to get item in the 'drilldown'

Herman Tran · Accepted Answer · 2013-09-11 06:04:39Z

1

Since the drilldown is directly set as a model attribute, you would first use model.get('drilldown'). Then we get to data as a property with model.get('drilldown').data and then iterate over the data property which is an array:

for (var i = 0, data = model.get('drilldown').data; i < data.length; i++) {
   // Each array element data[i] has a x and y property
   console.log(data[i].x, data[i].y);  // Logs 1.3722057e+12, 67.84
}

answered Sep 11, 2013 at 6:04

Herman Tran

1,5912 gold badges12 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Muhaimin Over a year ago

your solution seems easy for to understand but i think i have error on the json return. I'm not sure which json part is missing.

Muhaimin Over a year ago

error trigger during fetch, so i tried to catch the error but nothing hint me to the cause

Herman Tran Over a year ago

Yep, if you pass the data into JSONLint, it doesn't validate because all properties and values need to be in quotes: such as "y": 11.94,"drilldown": So just make all the y, drilldown, and data properties quoted.

Collectives™ on Stack Overflow

nested json in backboneJS view

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related