Creating a mini map using MapKit on the iPhone

Nov 20

Creating a mini map using MapKit on the iPhone

So as promised here is the final part of my MapKit tips and tricks using the iPhone SDK.

Sorry it’s a little later than I intended as I wanted my version of the feature live in the AppStore before I published the article.

So we’ve seen before how to create a simple map, well now let’s see how to create a really small thumbnail sized version like this (sorry there is no anti-aliasing, the iPhone simulator doesn’t support it on MapKit, works fine on the actual device though!)

smallmap

In my version, I take this code and add it to a much larger view controller like this

bigmap

A bit of shameless plugging: this comes from Tweetings for the iPhone

I won’t cover anything more to this other than getting the map to a state where you can add it to any view of yours using the [object addSubview:mapView] call.

Generating the map

This is the same as generating a large map, that we’ve covered before, except the frame will be of a different size, however the most important factor here is we are going to scale the map

float scaleBy = 0.80;
MKMapView *mapView = [[[MKMapView alloc] initWithFrame:CGRectMake(-5, 0, 100/ scaleBy, 50/scaleBy)] autorelease];
mapView.delegate=self;
mapView.layer.cornerRadius = 10.0; // Make the corners rounded
mapView.opaque = NO; // If you are using in a UITableView never set to YES!
mapView.scrollEnabled = NO; // Don't allow user interaction
mapView.zoomEnabled = NO;
mapView.layer.borderColor = [UIColor colorWithWhite:0.0f alpha:0.5f].CGColor;
mapView.layer.borderWidth = 1.0f/ scaleBy;
mapView.layer.transform = CATransform3DMakeScale(scaleBy, scaleBy, 1.0);

At this point you can actually now add it to your view and set any other properties in the same way as you would normally, job done…. yes it really is that simple!

No comments

Trackbacks/Pingbacks

  1. How to add a pin to embedded map | richard hyland - [...] The final part demonstrates how to create a mini map [...]

Leave a Reply

You must be logged in to post a comment.