Adding Local Weather Conditions To Your App (Part 2/2: Accessing Google’s XML Weather API)

Matt Tuzzolo — Wed, 29 Sep 2010 19:36:36 +0000

In this Part 2 of ‘Adding Local Weather Conditions To Your App’, I’ll show you how to quickly add current temp, conditions, and today’s high / low temperature to your app.

If you’re lucky enough to already have the user’s zipcode or city and state, this should go very quickly for you. Otherwise, check out Part 1 (Integrating CoreLocation).

Let’s get started.

There are a handful of solid XML Weather APIs out there. The best one I’ve seen so far is Wunderground’s (it’s extremely well documented) but for the purposes of this tutorial, I decided to use Google’s “super secret” Weather API. It’s incredibly simple and should take care of all your basic weather needs. Though if you’re planning on releasing a production App, be sure to pick a public API and check out their TOS (some require API keys, or fees for production use). Here’s a good list of Weather APIs

Let’s look at some example calls to Google:

http://www.google.com/ig/api?weather=01451

http://www.google.com/ig/api?weather=nyc

http://www.google.com/ig/api?weather=Portland,OR

http://www.google.com/ig/api?weather=Jamaica

As you can see, there’s a bit of flexibility in how you can query the service. The one piece it’s lacking is querying by latitude and longitude. Lucky for you, I’ll show you how to use MKReverseGeocoder to determine your user’s City/State, which you can then plug right into the GET request. First, let’s take a quick look at the XML that comes back from the API:

="1.0"?>
  ="1">
    ="0" tab_id="0" mobile_row="0" mobile_zipped="1" row="0" section="0">
      
        ="Portland, OR"/>
        ="97217"/>
        =""/>
        =""/>
        ="2010-09-20"/>
        ="2010-09-20 23:46:50 +0000"/>
        ="US"/>
      </forecast_information>
      
        ="Cloudy"/>
        ="64"/>
        ="18"/>
        ="Humidity: 55%"/>
        ="/ig/images/weather/cloudy.gif"/>
        ="Wind: SW at 8 mph"/>
      </current_conditions>
      
        ="Mon"/>
        ="51"/>
        ="66"/>
        ="/ig/images/weather/partly_cloudy.gif"/>
        ="Partly Cloudy"/>
      </forecast_conditions>
      
        ="Tue"/>
        ="50"/>
        ="68"/>
        ="/ig/images/weather/partly_cloudy.gif"/>
        ="Partly Cloudy"/>
      </forecast_conditions>
      
        ="Wed"/>
        ="53"/>
        ="68"/>
        ="/ig/images/weather/sunny.gif"/>
        ="Sunny"/>
     </forecast_conditions>
    
      ="Thu"/>
      ="53"/>
      ="65"/>
      ="/ig/images/weather/rain.gif"/>
      ="Showers"/>
    </forecast_conditions>
  </weather>
</xml_api_reply>

All this should be pretty self explanatory. The two pieces to pay attention to here are current_conditions, and forecast_conditions. For our demo app, we’re simply going to display current temperature, conditions, a conditionsIcon, and today’s high and low temp. We’ll be able to pull all this information out of current_conditions and the first forecast_conditions (which is the forecast for today). In the interest of keeping everything organized, let’s build a class to hold our weather info.

//
//  ICB_WeatherConditions.h
//  LocalWeather
//
//  Created by Matt Tuzzolo on 9/28/10.
//  Copyright 2010 iCodeBlog. All rights reserved.
//
 
@interface ICB_WeatherConditions : NSObject {
    NSString *condition, *location;
    NSURL *conditionImageURL;
    NSInteger currentTemp,lowTemp,highTemp;
}
 
@property (nonatomic,retain) NSString *condition, *location;
@property (nonatomic,retain) NSURL *conditionImageURL;
@property (nonatomic) NSInteger currentTemp, lowTemp, highTemp;
 
- (ICB_WeatherConditions *)initWithQuery:(NSString *)query;
 
@end

In the .m we’re going to pull the data out of the XML and store it in our properties. There are several 3rd party Objective-C XML parsers. I’ve chosen to use Jonathan Wight’s TouchXML as it’s become somewhat of a standard for parsing XML on iOS. You can find it here. You’ll have to jump through a couple hoops to get TouchXML into your project. Here’s an excellent tutorial on installing TouchXML that will walk you through the whole process if you’ve never done it before.

//
//  ICB_WeatherConditions.m
//  LocalWeather
//
//  Created by Matt Tuzzolo on 9/28/10.
//  Copyright 2010 iCodeBlog. All rights reserved.
//
 
#import "ICB_WeatherConditions.h"
#import "TouchXML.h"
 
@implementation ICB_WeatherConditions
 
@synthesize currentTemp, condition, conditionImageURL, location, lowTemp, highTemp;
 
- (ICB_WeatherConditions *)initWithQuery:(NSString *)query
{
    if (self = [super init])
    {
        CXMLDocument *parser = [[[CXMLDocument alloc] initWithContentsOfURL:[NSURL URLWithString:[NSString stringWithFormat:@"http://www.google.com/ig/api?weather=%@", query]] options:0 error:nil] autorelease];
 
        condition         = [[[[[parser nodesForXPath:@"/xml_api_reply/weather/current_conditions/condition" error:nil] objectAtIndex:0] attributeForName:@"data"] stringValue] retain];
        location          = [[[[[parser nodesForXPath:@"/xml_api_reply/weather/forecast_information/city" error:nil] objectAtIndex:0] attributeForName:@"data"] stringValue] retain];
 
        currentTemp       = [[[[[parser nodesForXPath:@"/xml_api_reply/weather/current_conditions/temp_f" error:nil] objectAtIndex:0] attributeForName:@"data"] stringValue] integerValue];
        lowTemp           = [[[[[parser nodesForXPath:@"/xml_api_reply/weather/forecast_conditions/low" error:nil] objectAtIndex:0] attributeForName:@"data"] stringValue] integerValue];
        highTemp          = [[[[[parser nodesForXPath:@"/xml_api_reply/weather/forecast_conditions/high" error:nil] objectAtIndex:0] attributeForName:@"data"] stringValue] integerValue];
 
        conditionImageURL = [[NSURL URLWithString:[NSString stringWithFormat:@"http://www.google.com%@", [[[[parser nodesForXPath:@"/xml_api_reply/weather/current_conditions/icon" error:nil] objectAtIndex:0] attributeForName:@"data"] stringValue]]] retain];
    }
 
    return self;
}
 
- (void)dealloc {
    [conditionImageURL release];
    [condition release];
    [location release];
    [super dealloc];
}
 
@end

I’ve decided to write my own init method to handle making the request to our API. This will make for a clean implementation in our view controller.

Before we get to implementing ICB_WeatherConditions, I’ll touch briefly on location. Part 1/2 of this tutorial covered finding your user’s latitude and longitude with Core Location. Use MKReverseGeocoder to find city/state from coordinates. Start by adding both the MapKit and CoreLocation frameworks to your project.

MKReverseGeocoder works asynchronously to resolve location info; it has a delegate. In our example we set the delegate to the view controller (self). Be sure to add to your header as well. Since your view controller is now the delegate for the geocoder, make sure to implement the delegate methods for the MKReverseGeocoderDelegate protocol:

#pragma mark MKReverseGeocoder Delegate Methods
- (void)reverseGeocoder:(MKReverseGeocoder *)geocoder didFindPlacemark:(MKPlacemark *)placemark
{
    [geocoder release];
    [self performSelectorInBackground:@selector(showWeatherFor:) withObject:[placemark.addressDictionary objectForKey:@"ZIP"]];
}
 
- (void)reverseGeocoder:(MKReverseGeocoder *)geocoder didFailWithError:(NSError *)error
{
    NSLog(@"reverseGeocoder:%@ didFailWithError:%@", geocoder, error);
    [geocoder release];
}

Now we’re ready to implement ICB_WeatherConditions. I usually populate UILabels in viewDidLoad, but since we’re making API calls and downloading a remote image (the weather conditions icon), I decided to write a method to execute in the background. This lets us use synchronous requests (which a lot easier to deal with) to handle network requests without locking up the main thread. Once our network calls have finished, we call back to the main thread to update the UI accordingly.

// This will run in the background
- (void)showWeatherFor:(NSString *)query
{
    NSAutoreleasePool *pool = [[NSAutoreleasePool alloc] init];
 
    ICB_WeatherConditions *weather = [[ICB_WeatherConditions alloc] initWithQuery:query];
 
    self.conditionsImage = [[UIImage imageWithData:[NSData dataWithContentsOfURL:weather.conditionImageURL]] retain];
 
    [self performSelectorOnMainThread:@selector(updateUI:) withObject:weather waitUntilDone:NO];
 
    [pool release];
}
 
// This happens in the main thread
- (void)updateUI:(ICB_WeatherConditions *)weather
{
    self.conditionsImageView.image = self.conditionsImage;
    [self.conditionsImage release];
 
    [self.currentTempLabel setText:[NSString stringWithFormat:@"%d", weather.currentTemp]];
    [self.highTempLabel setText:[NSString stringWithFormat:@"%d", weather.highTemp]];
    [self.lowTempLabel setText:[NSString stringWithFormat:@"%d", weather.lowTemp]];
    [self.conditionsLabel setText:weather.condition];
    [self.cityLabel setText:weather.location];
 
    [weather release];
}

Of course make sure your NIB is connected to your IBOutlets properly.

Now the final piece:

[self performSelectorInBackground:@selector(showWeatherFor:) withObject:@"97217"];

Build and Run:

And you’re done!

You can see the complete class below. I’ve also posted a demo project to github.

My name is Matt Tuzzolo (@matt_tuzzolo). I hope you found this post helpful.

//
//  LocalWeatherViewController.h
//  LocalWeather
//
//  Created by Matt Tuzzolo on 8/30/10.
//  Copyright iCodeBlog LLC 2010. All rights reserved.
//
 
#import 
#import "MapKit/MapKit.h"
 
@interface LocalWeatherViewController : UIViewController  {
    IBOutlet UILabel *currentTempLabel, *highTempLabel, *lowTempLabel, *conditionsLabel, *cityLabel;
    IBOutlet UIImageView *conditionsImageView;
    UIImage *conditionsImage;
}
 
@property (nonatomic,retain) IBOutlet UILabel *currentTempLabel, *highTempLabel, *lowTempLabel, *conditionsLabel, *cityLabel;
@property (nonatomic,retain) IBOutlet UIImageView *conditionsImageView;
@property (nonatomic,retain) UIImage *conditionsImage;
 
- (void)updateUI:(ICB_WeatherConditions *)weather;
 
@end

And the .m:

//
//  LocalWeatherViewController.m
//  LocalWeather
//
//  Created by Matt Tuzzolo on 8/30/10.
//  Copyright iCodeBlog LLC 2010. All rights reserved.
//
 
#import "LocalWeatherViewController.h"
#import "ICB_WeatherConditions.h"
#import "MapKit/MapKit.h"
 
@implementation LocalWeatherViewController
 
@synthesize currentTempLabel, highTempLabel, lowTempLabel, conditionsLabel, cityLabel;
@synthesize conditionsImageView;
@synthesize conditionsImage;
 
- (void)viewDidLoad {
    [super viewDidLoad];
 
    if (1) //you have coordinates but need a city
    {
        // Check out Part 1 of the tutorial to see how to find your Location with CoreLocation
        CLLocationCoordinate2D coord;
        coord.latitude = 45.574779;
        coord.longitude = -122.685366;
 
        // Geocode coordinate (normally we'd use location.coordinate here instead of coord).
        // This will get us something we can query Google's Weather API with
        MKReverseGeocoder *geocoder = [[MKReverseGeocoder alloc] initWithCoordinate:coord];
        geocoder.delegate = self;
        [geocoder start];
    }
    else // You already know your users zipcode, city, or otherwise.
    {
        // Do this in the background so we don't lock up the UI.
        [self performSelectorInBackground:@selector(showWeatherFor:) withObject:@"97217"];
    }
}
 
- (void)showWeatherFor:(NSString *)query
{
    NSAutoreleasePool *pool = [[NSAutoreleasePool alloc] init];
 
    ICB_WeatherConditions *weather = [[ICB_WeatherConditions alloc] initWithQuery:query];
 
    [self.currentTempLabel setText:[NSString stringWithFormat:@"%d", weather.currentTemp]];
    [self.highTempLabel setText:[NSString stringWithFormat:@"%d", weather.highTemp]];
    [self.lowTempLabel setText:[NSString stringWithFormat:@"%d", weather.lowTemp]];
    [self.conditionsLabel setText:weather.condition];
    [self.cityLabel setText:weather.location];
 
    self.conditionsImageView.image = [UIImage imageWithData:[NSData dataWithContentsOfURL:weather.conditionImageURL]];
 
    [weather release];
 
    [pool release];
}
 
#pragma mark MKReverseGeocoder Delegate Methods
- (void)reverseGeocoder:(MKReverseGeocoder *)geocoder didFindPlacemark:(MKPlacemark *)placemark
{
    [geocoder release];
    [self performSelectorInBackground:@selector(showWeatherFor:) withObject:[placemark.addressDictionary objectForKey:@"ZIP"]];
}
 
- (void)reverseGeocoder:(MKReverseGeocoder *)geocoder didFailWithError:(NSError *)error
{
    NSLog(@"reverseGeocoder:%@ didFailWithError:%@", geocoder, error);
    [geocoder release];
}
 
- (void)didReceiveMemoryWarning {
     [super didReceiveMemoryWarning];
}
 
- (void)viewDidUnload {
	// Release any retained subviews of the main view.
	// e.g. self.myOutlet = nil;
}
 
- (void)dealloc {
    [super dealloc];
}
 
@end

Introduction to MapKit in iPhone OS 3.0 Part 2

Collin — Tue, 22 Dec 2009 18:53:56 +0000

Introduction

Back in September I posted a large post going over all the components required to implement the MapKit in your application. The MapKit is a framework introduced in iPhone OS 3.0 and allows developers to easily take advantage of Google’s mapping technology. In my first post I go over how to present a map as well as annotate the map with custom badges to highlight points of interest. The MapKit also gives developers access to reverse geocoding services from Google which I will cover in this post.

Reverse Geocoding

A users location is defined by coordinates. When using the Core Location services, or specifying where a map should center its view, coordinates will be the units developers will be working with. This is all well and good for presenting mapping information visually but there is a whole other set of information that can be derived from a set of coordinates.

Country
State
Zip Code
Address

Google provides the service to translate any coordinate set to an MKPlacemark object. An MKPlacemark object contains properties to access all this information. Let’s look into the process of getting this object.

Step 1

The first thing you need to do is make a “View Based Application”. Now we need to is pick a set of coordinates we want to use. I have decided to use the address of Arizona State University.

Longitude: -111.936619;

Latitude: 33.416199;

Make your AppDelegates .m file look like this:

- (void)applicationDidFinishLaunching:(UIApplication *)application {
    // Override point for customization after app launch
    [window addSubview:viewController.view];
    [window makeKeyAndVisible];
 
	CLLocationCoordinate2D coord;
	coord.longitude = -111.936619;
	coord.latitude = 33.416199;
 
	MKReverseGeocoder *geocoder = [[MKReverseGeocoder alloc] initWithCoordinate:coord];
	[geocoder setDelegate:self];
	[geocoder start]
}

Step 2

Now we need to implement the MKReverseGeocoderDelegate methods. There are only 2 delegate methods:

Called when an error occurs when fetching the reverse geocoder object

- (void)reverseGeocoder:(MKReverseGeocoder *)geocoder didFailWithError:(NSError *)error

Called when the ReverseGeocode object is successfully returned.

- (void)reverseGeocoder:(MKReverseGeocoder *)geocoder didFindPlacemark:(MKPlacemark *)placemark

Step 3

Now we have a MKPlacemark object to use. An MKPlacemark object conforms to the MKAnnotation protocol. So these objects could be added as annotations to an MKMapView. For more information on MKAnnotations reference part 1. The MKPlacemark object contains the following properties that you can access to use in your application.

To see all of these values make the success delegate method look like this:

- (void)reverseGeocoder:(MKReverseGeocoder *)geocoder didFindPlacemark:(MKPlacemark *)placemark
{
	NSLog(@"The geocoder has returned: %@", [placemark addressDictionary]);
}

You should see this output:

2009-12-22 11:23:05.492 ReverseGeocoder[2591:207] The geocoder has returned: {
    City = Tempe;
    Country = "United States";
    CountryCode = US;
    FormattedAddressLines =     (
        "200-206 E Lemon St",
        "Tempe, AZ 85281",
        USA
    );
    State = Arizona;
    Street = "200-206 E Lemon St";
    SubAdministrativeArea = Maricopa;
    SubThoroughfare = "200-206";
    Thoroughfare = "E Lemon St";
    ZIP = 85281;
}