The other day, I was looking for a free weather forecast api for a project I’m working on. I managed to find a few, but the one that seemed to be the fastest and easiest to implement was  ”The secret Google Weather API” (that’s the way it was called in few posts I’ve read).

Anyhow, the “Free Computer Advice” blog, had a nice post that explained how to use this weather API with PHP, but since the site went down on Dec 2011 it’s not accessible anymore.
Luckily, I managed to snag the post’s content from Google Cache before it was removed entirely, so here it is for your pleasure.

Google Weather API

Every web designer has at one point or another been asked, “How can I get weather on my site?” The old answer was to have a giant ugly weather channel gadget. Something that looked very nasty and you couldn’t un-brand it no matter what. Some used an iframe to display external data and have it appear to be on their site. Lastly you could always just have a link that says ‘click here for weather’. My goal was to get weather data from an external source and be able to customize how it looks. Fortunately now there are some great resources out there. I’m going with one that is my favorite, something extremely easy to use and customize – Google’s Weather API.

To start lets pull up the URL in your browser.

http://www.google.com/ig/api?weather=new+york,ny

You’ll see XML data of the weather in New York! Easy enough, let’s take a look at the output.

  1. <xml_api_reply version=”1″>
  2. <weather module_id=”0″ tab_id=”0″ mobile_row=”0″ mobile_zipped=”1″ row=”0″ section=”0″ >
  3. <forecast_information>
  4. <city data=”New York, NY”/>
  5. <postal_code data=”new york,ny”/>
  6. <latitude_e6 data=” “/>
  7. <longitude_e6 data=” “/>
  8. <forecast_date data=”2009-08-02″/>
  9. <current_date_time data=”2009-08-02 12:19:00 +0000″/>
  10. <unit_system data=”US”/>
  11. </forecast_information>
  12.      <current_conditions>
  13.      <condition data=”Light rain”/>
  14.      <temp_f data=”72″/>
  15.      <temp_c data=”22″/>
  16.      <humidity data=”Humidity: 94%”/>
  17.      <icon data=”/ig/images/weather/mist.gif”/>
  18.      <wind_condition data=”Wind: N at 6 mph”/>
  19.      </current_conditions>
  20. </weather>
  21. </xml_api_reply>

Wow check out how easy that was. Now all we did was submit the location and hit enter. Now we have in XML weather data for that area. No advertisements and since the data is in XML we can make it look however we want. Note: I shortened the output to only one day. So what’s next? Well in my case I used a PHP script to output this data. Let’s take a look at that source code.

 

  1. <?php
  2. function getWeather() {
  3. $requestAddress = “http://www.google.com/ig/api?weather=21619&hl=en”;
  4. // Downloads weather data based on location – I used my zip code.
  5. $xml_str = file_get_contents($requestAddress,0);
  6. // Parses XML
  7. $xml = new SimplexmlElement($xml_str);
  8. // Loops XML
  9. $count = 0;
  10. echo ‘<div id=”weather”>’;
  11.      foreach($xml->weather as $item) {
  12.           foreach($item->forecast_conditions as $new) {
  13.                echo ‘<div class=”weatherIcon”>’;
  14.                echo ‘<img src=”http://www.google.com/’ . $new->icon[‘data’] . ‘”/><br/>’;
  15.                echo $new->day_of_week[‘data’];
  16.                echo ‘</div>’;
  17.                }
  18.           }
  19. echo ‘</div>’;
  20. }
  21. getWeather();
  22. ?>

I hope this tutorial was helpful! The Weather API is great on so many levels, fast, easy and customizable.