Error help with Weather API

I’m doing the weather api project, and I started by getting the latitude and longitude. then I tried to plug it into the url, but I keep getting an error. All help is appreciated.

Here’s a link to my pen: https://codepen.io/b3u/pen/qyjWoZ?editors=0011

Here’s my error:

Object {
  error: "Please provide longitude as lon and latitude as lat as numbers/floats."
}

You can place the ajax call inside the showPosition() function that would fix the error.

The reason your getting the error is because the ajax call is being called before the shoPosition function is finished.

1 Like
var place = document.querySelector('#place');

let lat;
let lon;

if (navigator.geolocation) {
  navigator.geolocation.getCurrentPosition(showPosition);
}//
else {
  place.innerHTML = "Sorry, your browser is not supported. Darn!"
}

function showPosition(position){
  lat = parseFloat(position.coords.latitude).toFixed(2);
  lon = parseFloat(position.coords.longitude).toFixed(2);
  
  //Ajax Request
  var url = "https://fcc-weather-api.glitch.me/api/current?lat=" + lat + "&lon=" + lon;
  $.ajax({
    type: "GET",
    datatype: "jsonp",
    jsonp: "callback",
    url: url,
    success: function(data) {
      console.log(data);
    }
  });
  
  place.innerHTML = "lat: " + lat + "<br/>lon: " + lon;
}
1 Like