How to combine the data from 2 json files with jQuery

Question

I am attempting to create a Google map with data from two separate json files. I'm trying to use jquery/javascript to combine the two files and then process the resulting array of objects through the Google Maps API.

I've tried $.extend, $.merge, concat, and I've even tried pushing the data into an empty array, but in each case only the first set of data is appearing on the map (although I can see both sets of data separately if I display them with console.log).

I must be doing something fundamentally wrong, but I'm not seeing it. The relevant part of my code is as follows (with the things I've tried commented out). Any suggestions would be most appreciated.

j$.when(
    j$.getJSON('mapData1.js'),
    j$.getJSON('mapData2.js')
).done(function(data1, data2) {
    var d1 = data1;
    var d2 = data2;
    var d3 = [];
    d3.push(d1[0]);
    d3.push(d2[0]);
    //var d3 = j$.extend({},d1,d2);
    //var d3 = j$.merge(d1,d2);
    //var d3 = d1.concat(d2);
    var data = d3[0];

    //code to process data with Google Maps API
});

My json files look like this (but with many more items):

[
    {
        "ID": "a001a000002o4iZAAQ",
        "NAME": "Atlanta",
        "Address": "123 State Street",
        "City": "Atlanta",
        "StateAbbreviation": "GA",
        "SF": "",
        "LeaseExpiration": "8/31/2012",
        "Occupancy": "2",
        "Country": "USA",
        "Address2": "",
        "Lat": "33.7863317",
        "Lng": "-84.3836873",
        "Type": "loc",
        "Color": "red"
    }
]

var data = d3[0]; here you say explicitly the first set of data. did you try this: var data = d3; — Eeliya, Aug 18 '15 at 11:32
possible duplicate of [How can I merge properties of two JavaScript objects dynamically?](http://stackoverflow.com/questions/171251/how-can-i-merge-properties-of-two-javascript-objects-dynamically) — Popnoodles, Aug 18 '15 at 11:45
@Eeliya: Yes, I'm realizing now that I'm returning the two datasets as separate objects. I would like to combine the data items into one big array, e.g., if data1 = [{"a":"xA1","b":"xB1"},{"a":"xA2","b":"xB2"}] and data2 = [{"a":"xA3","b":"xB3"},{"a":"xA4","b":"xB4"},{"a":"xA5","b":"xB5"}], I'd like the result to be: [{"a":"xA1","b":"xB1"},{"a":"xA2","b":"xB2"},{"a":"xA3","b":"xB3"},{"a":"xA4","b":"xB4"},{"a":"xA5","b":"xB5"}] — djackiem, Aug 20 '15 at 21:47

score 1 · Accepted Answer · answered Aug 18 '15 at 11:39

1

you can use concat()

var array1 = [{
    "ID-1": "a001a000002o4iZAAQ",
        "NAME-1": "Atlanta",
        "Address-1": "123 State Street",
        "City-1": "Atlanta",
        "StateAbbreviation-1": "GA",
        "SF-1": "",
        "LeaseExpiration-1": "8/31/2012",
        "Occupancy-1": "2",
        "Country-1": "USA",
        "Address2-1": "",
        "Lat-1": "33.7863317",
        "Lng-1": "-84.3836873",
        "Type-1": "loc",
        "Color-1": "red"
}];
var array2 = [{
    "ID-2": "a001a000002o4iZAAQ",
        "NAME-2": "Atlanta",
        "Address-2": "123 State Street",
        "City-2": "Atlanta",
        "StateAbbreviation-2": "GA",
        "SF-2": "",
        "LeaseExpiration-2": "8/31/2012",
        "Occupancy-2": "2",
        "Country-2": "USA",
        "Address2-2": "",
        "Lat-2": "33.7863317",
        "Lng-2": "-84.3836873",
        "Type-2": "loc",
        "Color-2": "red"
}];

var array3 = array1.concat(array2);

alert(JSON.stringify(array3));

answered Aug 18 '15 at 11:39

ozil

6,930
9
33
56

I tried this as well, and it is also just returning the two original datasets as separate objects -- I would like to combine all of the objects within each of the original datasets into an array of objects, e.g., if data1 = [{"a":"xA1","b":"xB1"},{"a":"xA2","b":"xB2"}] and data2 = [{"a":"xA3","b":"xB3"},{"a":"xA4","b":"xB4"},{"a":"xA5","b":"xB5"}], I'd like the result to be: [{"a":"xA1","b":"xB1"},{"a":"xA2","b":"xB2"},{"a":"xA3","b":"xB3"},{"a":"xA4","b":"xB4"},{"a":"xA5","b":"xB5"}] – djackiem Aug 20 '15 at 21:44
@djackiem just replace `array1` and `array2` with your `data1` and `data2`, you will have the desired results. – ozil Aug 21 '15 at 07:23
Thank you -- this worked for me finally. The reason it wasn't working initially was that there was something wrong with the data in one of my JSON files and it was coming through with newline characters and wasn't being parsed as JSON. – djackiem Aug 23 '15 at 10:03

How to combine the data from 2 json files with jQuery

1 Answers1