main
is the JSON object's property that I want to get from the weather API, but I'm getting the following error:
Uncaught TypeError: Cannot read property 'main' of undefined
What's wrong?
HTML code:
<!-- display current temperature in Fahrenheight (default) -->
<div id="temp"></div>
<!-- display user's curent location -->
<div id="pos"></div>
<button id="loc">Show my location</button>
<button id="switch">Switch Metric Unit</button>
// return temperature and weather conditions for user's current location
var temp = document.getElementById('temp');
temp.innerHTML = "";
var tempStr = document.getElementById('temp').innerHTML;
var latitude;
var longitude;
JS code:
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
latitude = position.coords.latitude;
longitude = position.coords.longitude;
// pos = position.coords.latitude + ", " + position.coords.longitude;
})};
$.getJSON("https://fcc-weather-api.glitch.me/api/current?lat=" + latitude + "&lon=" + longitude,
setTimeout(function(data) {
$('#temp').html(celsiusToFahrenheit(data.main.temp) + "°F");
}), 1000)