The issue I’m running into is with the getJSON success handler: I’m trying to display the weather icon from the JSON response. Here is my JS:
$(document).ready(function() {
var lat;
var lon;
function getLocation() {
navigator.geolocation.getCurrentPosition(function(position) {
lat = position.coords.latitude;
lon = position.coords.longitude;
$.getJSON("https://fcc-weather-api.glitch.me/api/current?lat=" + lat + "&lon=" + lon, function(json) {
$(".Main").html('<img src="' + json.weather[0].icon + '" />');
});
});
};
getLocation();
});
The getJSON request appears to be successful because if I use the success handler below, I am able to display the raw JSON data on the page:
function(json) {
$(".Main").html(JSON.stringify(json));
Is there a syntax issue I’m missing? Any help would be appreciated.
Cheers,
rmallory