Weather API help with url undefined

Weather API help with url undefined
0

#1

Hello.
I am about to finish the API.
Everything works great except of the part of setting the langtutide and longtitude to the url of the $.get() api of the weather forecast.
I got the lang and long and stored them in separate variables. I am trying to get weather information using

$.get(“http://api.openweathermap.org/data/2.5/weather?lat="+latitude+"&lon="+long+"&appid=a81e586ba64fbea6c9129410329f4a3a”, function( result ) {

but sadly there is an error and in the debugger, instead of the long and land in the url I see undefined. Maybe it is because I am retrieving the long and latitude from another Api with Ajax and it takes time to load?


#2

Hi,

It worked for me (I stored it in a variable and used it in the url construction). Do you have a codepen link to look into the issue. The Javascript calls are asynchronous. So you may need to call the above after you retrieve the lat and lon values.

Thanks


#3

Thanks.
I finally finished it and it works great!
The problem was that I used Asynchronous function in order to get the long and lat and it was undefined because the other function hasn’t been loaded yet.
I fixed it by putting the second $.get function inside the first one so the long and lat wouldn’t be undefined.
Anyways, I will be happy if u tell me your opinion about the project:


#4

Good that you were able to identify the issue and fix it. The App looks good. Here are my observations

  1. I use Firefox browser and for some reason it does not display the details in firefox, looks like it is not getting the latitude and longitude information. It works great in Chrome.

  2. The conversion of units (Celsius to Fahrenheit) is not very intuitive to the user. I have the same issue and couldn’t think of a better way. For now I have a tool tip on the icon that says “click to change units”.

Thanks


#5

Nice app!

If you want to make the temperature change more intuitive (by indicating that the unit can be clicked), you can simply add a css {cursor: pointer} in the class/id corresponding to the unit symbol.

I hope this helps.

JP