Weather widgets and API with Weather Underground

Many weather sites offer embeddable widgets to display weather forecasts on your website. However, if you want to customize the look of the widget, your options are usually quite limited. Weather Underground far surpasses the rest of the options by providing a JSON-based API so that you can use their data to build and style your own widgets.

Registration is quick and easy. The basic account gives you an API call limit of 500 calls per day at a maximum rate of 10 calls per minute, as well as flexible allowance to occasionally go over your limit. If you're just building a sidebar widget, for example, you can implement caching on your end so that you're only making something like 1 call per hour. If you have a more intense application, you can pay for a more advanced account.

The available options are very impressive. To start, making a simple forecast call essentially involves making a standard cURL call to read a URL such as:

http://api.wunderground.com/api/<api_key>/forecast/q/BC/Vancouver.json

Then parse the response, which is partially pasted below to give you an idea of the fields that are available:

"simpleforecast": {
  "forecastday": [
  {"date":{
 "epoch":"1347084000",
 "pretty":"11:00 PM PDT on September 07, 2012",
 "day":7,
 "month":9,
 "year":2012,
 "yday":250,
 "hour":23,
 "min":"00",
 "sec":0,
 "isdst":"1",
 "monthname":"September",
 "weekday_short":"Fri",
 "weekday":"Friday",
 "ampm":"PM",
 "tz_short":"PDT",
 "tz_long":"America/Vancouver"
},
  "period":1,
  "high": {
  "fahrenheit":"72",
  "celsius":"22"
  },
  "low": {
  "fahrenheit":"57",
  "celsius":"14"
  },
  "conditions":"Partly Cloudy",
  "icon":"partlycloudy",
  "icon_url":"http://icons-ak.wxug.com/i/c/k/partlycloudy.gif",
  "skyicon":"partlycloudy",
  "pop":0,
  "qpf_allday": {
  "in": 0.00,
  "mm": 0.0
  },

The Weather Underground API is thorough and well organized. A fun and easy customization is to use one of their many icon sets; or, you can make your own icons and display them based on the condition identifiers, such as "clear" or "partlycloudy".

Here is a screenshot of a simple but customized widget we built for a client using the API to call the general forecast icon, high and low temperatures (available in fahrenheit or celsius of course), and description for 3 days:

That is of course only scratching the surface of what's available. You can look up hourly forecasts, weather alerts, historical data, tides, webcams, and much more.

If you haven't heard of Weather Underground before, be sure to check it out as a weather side apart from its API service as well. Its user interface is clean and intuitive and its reports are quite detailed.