Lab Session: Weather Data: Difference between revisions

From NSB App Studio
Jump to navigation Jump to search
Created page with "In this lab you will pull in some weather data."
 
No edit summary
 
(9 intermediate revisions by 3 users not shown)
Line 1: Line 1:
In this lab you will pull in some weather data.
In this lab you will pull in some weather data from http://openweathermap.org/API.
 
== Student Outline ==
 
# Open LabWeather.nsx.
# Add a click event to ''btnLoad'' on ''frmMain''
# OpenWeatherMaps requires an API key. Use appid = "2de143494c0b295cca9337e1e96b00e0"
# Have the click event use the value from ''txtCity'' to query OpenWeatherMap's API: <br>http://api.openweathermap.org/data/2.5/weather?q=Riyadh,sa&appid=2de143494c0b295cca9337e1e96b00e0&callback=weatherData
#* Keep in mind that you should URL encode any user entered parameters, like city, using [https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURIComponent encodeURIComponent]
#* Make sure you're using JSONP to make this request.
# Upon receiving the response, you should parse the response into the various Value labels on frmMain.  The format of the response is described here: http://bugs.openweathermap.org/projects/api/wiki/Weather_Data
 
== Bonus ==
 
* The [http://bugs.openweathermap.org/projects/api/wiki/API_2_5 weather API] has a lot of functionality that we aren't using.  Create new forms and fields to return and display either forecast data, historical data, or both.
* The city field requires a fairly exact name.  If you'd like to allow for mistakes and abbreviations, you can integrate the [http://bugs.openweathermap.org/projects/api/wiki/Api_2_5_searhing city search api].  This returns a list of possible city matches.  One way to use this is to present a list that the user can choose from in a new form.

Latest revision as of 15:48, 4 December 2015

In this lab you will pull in some weather data from http://openweathermap.org/API.

Student Outline

  1. Open LabWeather.nsx.
  2. Add a click event to btnLoad on frmMain
  3. OpenWeatherMaps requires an API key. Use appid = "2de143494c0b295cca9337e1e96b00e0"
  4. Have the click event use the value from txtCity to query OpenWeatherMap's API:
    http://api.openweathermap.org/data/2.5/weather?q=Riyadh,sa&appid=2de143494c0b295cca9337e1e96b00e0&callback=weatherData
    • Keep in mind that you should URL encode any user entered parameters, like city, using encodeURIComponent
    • Make sure you're using JSONP to make this request.
  5. Upon receiving the response, you should parse the response into the various Value labels on frmMain. The format of the response is described here: http://bugs.openweathermap.org/projects/api/wiki/Weather_Data

Bonus

  • The weather API has a lot of functionality that we aren't using. Create new forms and fields to return and display either forecast data, historical data, or both.
  • The city field requires a fairly exact name. If you'd like to allow for mistakes and abbreviations, you can integrate the city search api. This returns a list of possible city matches. One way to use this is to present a list that the user can choose from in a new form.