King King - 4 months ago 8
JSON Question

Looping a Json object in map.arc()

i am using http://jsbin.com/nutawiboci/1/edit?html,output to show the location of the origin and destination coordinate and draw an arc between them. so i modified the map.arc() to loop through a given origin and destination coordinate:

for (var i = 0; i < data.length; i++) {

var origin_long = data[i][0][0];
var origin_lat = data[i][0][1];

var destination_long = data[i][1][0];
var destination_lat = data[i][1][1];



map.arc([
{
origin: {
latitude: origin_lat,
longitude: origin_long
},
destination: {
latitude: destination_lat,
longitude: destination_long
}
}
], {strokeWidth: 2});
};


This actually works, but it only draws the last(from the loop) since it destroys the previous arcs before drawing the next. i just don't know how to iterate in the map.arc(). i want the loop to return something like this:

map.arc([
{
origin: {
latitude: 43.445,
longitude: 83.435345
},
destination: {
latitude: 324.2323,
longitude: -6
}
},
{
origin: {
latitude: -53.445,
longitude: 333.4345
},
destination: {
latitude: -24.2323,
longitude: 46.454
}
},
{
origin: {
latitude: 53.045,
longitude: 663.4345
},
destination: {
latitude: -94.2323,
longitude: 996.4454
}
}
], {strokeWidth: 2});


any other way than looping it is also appreciated, i just want it working this way. Thanks!

Answer

You are overwriting values in your loop..try pushing each co-ordinate into a temporary array first and then assign the temporary array to map arc try something like:

 var temp = []
 for (var i = 0; i < data.length; i++) {

  var origin_long  = data[i][0][0]; 
  var origin_lat   = data[i][0][1]; 

  var destination_long = data[i][1][0]; 
  var destination_lat  = data[i][1][1]; 

   var prepare  = 
        {origin: {
            latitude: origin_lat,
            longitude: origin_long
        },
        destination: {
            latitude: destination_lat,
            longitude: destination_long

      }};
  temp.push(prepare);
};

map.arc(temp,{strokeWidth: 2})