Why is JSON outputting out of order?
Posted
by
dcp3450
on Stack Overflow
See other posts from Stack Overflow
or by dcp3450
Published on 2011-01-06T16:20:02Z
Indexed on
2011/01/06
16:54 UTC
Read the original article
Hit count: 218
I'm am trying to get a list of weather information for 8 locations. I'm using a weather API that accepts longitude and latitude and spits back json output with the weather info for that location. I feed the coords in order 0->7 but when json processes the data it comes back in a seemingly random order. I assume it's because some process faster than others and json is outputing what it gets back as it gets it. The output is correct, only the order is wrong.
var loc = null;
var body = "";
var campuses = new Array(8);
campuses[0] = "34.47242,-84.42489,1";
campuses[1] = "33.81488,-84.62048,2";
campuses[2] = "34.27502,-84.46976,3";
campuses[3] = "33.92987,-84.55065,4";
campuses[4] = "34.03433,-84.46723,5";
campuses[5] = "34.08362,-84.67115,6";
campuses[6] = "33.91124,-84.82634,7";
campuses[7] = "34.10409,-84.51804,8";
function getWeather(campusArray)
{
body += '<p class="topTitle">Campus Weather</p>';
var cSplit = new Array();
cSplit = campusArray.split(',');
var loc = "http://www.worldweatheronline.com/feed/weather.ashx?q="+cSplit[0]+","+cSplit[1]+"&format=json&num_of_days=2&key=0a05fff921162948110401&callback=?";
$('#content').html('asdf');
$.getJSON(loc,function(js)
{
var data = js.data;
var humidity = data.current_condition[0].humidity;
var tempF = data.current_condition[0].temp_F;
var iconDESC = data.current_condition[0].weatherDesc[0].value;
var iconURL = data.current_condition[0].weatherIconUrl[0].value;
var windDir = data.current_condition[0].winddir16Point;
var windSpeed = data.current_condition[0].windspeedMiles;
var tempMaxF = data.weather[0].tempMaxF;
var tempMinF = data.weather[0].tempMinF;
body += '<p class="title">'+cSplit[2]+'</p>'+
'<span class="body">'+tempF+
' '+windSpeed+
'<img src="'+iconURL+'" /></span>';
$('#content').html(body);
});
}
getWeather(campuses[0]);
getWeather(campuses[1]);
getWeather(campuses[2]);
getWeather(campuses[3]);
getWeather(campuses[4]);
getWeather(campuses[5]);
getWeather(campuses[6]);
getWeather(campuses[7]);
I have also tried it as $.ajax
var loc = null;
var body = "";
var campuses = new Array(8);
campuses[0] = "34.47242,-84.42489,1";
campuses[1] = "33.81488,-84.62048,2";
campuses[2] = "34.27502,-84.46976,3";
campuses[3] = "33.92987,-84.55065,4";
campuses[4] = "34.03433,-84.46723,5";
campuses[5] = "34.08362,-84.67115,6";
campuses[6] = "33.91124,-84.82634,7";
campuses[7] = "34.10409,-84.51804,8";
function getWeather(campusArray)
{
body += '<p class="topTitle">Campus Weather</p>';
var cSplit = new Array();
cSplit = campusArray.split(',');
var loc = "http://www.worldweatheronline.com/feed/weather.ashx?q="+cSplit[0]+","+cSplit[1]+"&format=json&num_of_days=2&key=0a05fff921162948110401&callback=?";
$.ajax({
url: loc,
async: true,
dataType: "json",
success: function(js)
{
var data = js.data;
var humidity = data.current_condition[0].humidity;
var tempF = data.current_condition[0].temp_F;
var iconDESC = data.current_condition[0].weatherDesc[0].value;
var iconURL = data.current_condition[0].weatherIconUrl[0].value;
var windDir = data.current_condition[0].winddir16Point;
var windSpeed = data.current_condition[0].windspeedMiles;
var tempMaxF = data.weather[0].tempMaxF;
var tempMinF = data.weather[0].tempMinF;
body += '<p class="title">'+cSplit[2]+'</p>'+
'<span class="body">'+tempF+
' '+windSpeed+
'<img src="'+iconURL+'" /></span>';
$('#content').html(body);
}
});
}
getWeather(campuses[0]);
getWeather(campuses[1]);
getWeather(campuses[2]);
getWeather(campuses[3]);
getWeather(campuses[4]);
getWeather(campuses[5]);
getWeather(campuses[6]);
getWeather(campuses[7]);
EDIT:
example of json output:
{ "data": { "current_condition": [ {"cloudcover": "100", "humidity": "93", "observation_time": "04:04 PM", "precipMM": "0.0", "pressure": "1009", "temp_C": "2", "temp_F": "36", "visibility": "8", "weatherCode": "116", "weatherDesc": [ {"value": "Mist" } ], "weatherIconUrl": [ {"value": "http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0006_mist.png" } ], "winddir16Point": "WNW", "winddirDegree": "290", "windspeedKmph": "7", "windspeedMiles": "4" } ], "request": [ {"query": "Lat 34.47 and Lon -84.42", "type": "LatLon" } ], "weather": [ {"date": "2011-01-06", "precipMM": "9.3", "tempMaxC": "7", "tempMaxF": "45", "tempMinC": "2", "tempMinF": "35", "weatherCode": "113", "weatherDesc": [ {"value": "Sunny" } ], "weatherIconUrl": [ {"value": "http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0001_sunny.png" } ], "winddir16Point": "WNW", "winddirDegree": "293", "winddirection": "WNW", "windspeedKmph": "20", "windspeedMiles": "13" }, {"date": "2011-01-07", "precipMM": "0.0", "tempMaxC": "6", "tempMaxF": "44", "tempMinC": "0", "tempMinF": "31", "weatherCode": "116", "weatherDesc": [ {"value": "Partly Cloudy" } ], "weatherIconUrl": [ {"value": "http:\/\/www.worldweatheronline.com\/images\/wsymbols01_png_64\/wsymbol_0002_sunny_intervals.png" } ], "winddir16Point": "WNW", "winddirDegree": "286", "winddirection": "WNW", "windspeedKmph": "25", "windspeedMiles": "16" } ] }}
© Stack Overflow or respective owner