Weather app question about saving location (and feedback)


So I have almost finished my local weather project, but I still think it is too simple, I just couldn’t find how to improve it. Also please view JS code, I couldn’t save variables from callback function, so I couldn’t use latitude and longitude variables outside of callback function. Also please provide feedback for my work, is it too simple for this challenge?
Here is the codepen

See the Pen FreeCodeCamp weather app by Grigor Minasyan (@gogminsam) on CodePen.


You can display the location… city, state?
Display lat/long?
Display other stuff than just temperature.

You can define lat/long variables outside the callback, then assign values to it inside the callback.

Here’s my weather app…
Once you’re in it, drag the map to a new location to see weather at that location.
Gee, I wonder what’s the weather in Mongolia today… just drag the map and go there.


Nice work on your weather app. It is very simple though, you are right. You could try and add the city name as an additional challenge. A background image and a slightly narrower view for mobile wouldn’t hurt either.

For your code, you could simplify it a lot by getting rid of that switch statement. The weather icons you’ve included in your project are designed to work with the Dark Sky Weather API. All you have to do is prepend wi-forecast-io- to the icon code that comes back from the API.

$("#icon").addClass('wi-forecast-io-' + weather.currently.icon);

For your location question, one common approach to this is to call a function when you get the location - and send the location data as an argument in that function.


Hi, thanks for the reply, I am still having issues with the lati and longi variables, they are defined outside, but I have read about them and they are asynchronous, I haven’t learned about those things yet. I have console logged and they still are undefined. Do you know how to make them defined, I think they are console.log ged before they are defined, even though I console.logged after their definition.


Thanks for your feedback, I have changed that icon.


You can’t do this

$(document).ready(function() {
  //console.log("latitude and longitude are " + lati + " " + longi);

Your variables lati and longi are out of scope and undefined at that point.

You can put it here

function posinvar(pos) {
  lati = pos.coords.latitude;
  longi = pos.coords.longitude;
  console.log("latitude and longitude are " + lati + " " + longi);

And your lati and longi values will be valid. And then just update your html text at this point.


But the thing is that I want to use lati and longi outside of posinvar(). Yes when I use them inside posinvar() it works.
How can I do that? Because I don’t want to do everything inside that function.