Advertise here




Advertise here

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

MKMapView tutorial using latitude and longitude

iamsgtyangiamsgtyang Posts: 25Registered Users @
edited July 2011 in Tutorial Discussion
Quick tutorial on how to create a MKMapView that sets its region to a specific latitude and longitude. You can check out the source code at my site if needed.

1. Create New Project, View-based Application, and name it MapTutorial
2. Add a new existing framework: MapKit.framework
3. Add the following to MapTutorialViewController.h

#import <MapKit/MapKit.h>
MKMapView *mapView;

The final MapTutorialViewController.h file should look like this

#import <UIKit/UIKit.h>
#import <MapKit/MapKit.h>

@interface MapTutorialViewController : UIViewController {

MKMapView *mapView;

}

@end

4. Add the following to viewDidLoad in MapTutorialViewController.m

mapView = [[MKMapView alloc] initWithFrame:self.view.bounds];
mapView.mapType = MKMapTypeHybrid;

CLLocationCoordinate2D coord = {latitude: 61.2180556, longitude: -149.9002778};
MKCoordinateSpan span = {latitudeDelta: 0.2, longitudeDelta: 0.2};
MKCoordinateRegion region = {coord, span};

[mapView setRegion:region];
[self.view addSubview:mapView];

What happened here is we allocated MKMapView to our mapView and set the location and size of the map view to fit the screen’s view bounds. We also declared the mapType to be MKMapTypeHybrid. If you want to know more, right click on MKMapTypeHybrid in your Xcode and search for the term in the documentation.

Now, we can just set the map to display our current location, which is easy but it takes the fun away. This is where the map’s API is tricky. We can set the region to display on the map by Google Map’s latitude and longitude. To do this, we have to get the MKCoordinateRegion for the location we want.

Here’s the long part. We have to know the longitude and latitude of the location from Google Maps. You get this in the URL when you search for a location. This is where CLLocationCoordinate2D coord = {} come in. You will set the latitude and longitude here.

Next the MKCoordinateSpan (defines the area spanned by a map region), I set it at 0.2. MKCoordinateRegion is made of CLLocationCoordinate2D and MKCoordinateSpan.

The reason for all this is because MKMapView’s setRegion parameter requires a MKCoordinateRegion. Finally, we add the mapView as a subview to self.view

The Final MapTutorialViewController.m file should look like this

#import “MapTutorialViewController.h”

@implementation MapTutorialViewController

- (void)viewDidLoad {

[super viewDidLoad];

mapView = [[MKMapView alloc] initWithFrame:self.view.bounds];
mapView.mapType = MKMapTypeHybrid;

CLLocationCoordinate2D coord = {latitude: 61.2180556, longitude: -149.9002778};
MKCoordinateSpan span = {latitudeDelta: 0.2, longitudeDelta: 0.2};
MKCoordinateRegion region = {coord, span};

[mapView setRegion:region];
[self.view addSubview:mapView];

}

- (void)didReceiveMemoryWarning {

[super didReceiveMemoryWarning];

}

- (void)dealloc {

[super dealloc];

}

@end

Now that’s it. Build and Run, you will see a hybrid map at the latitude and longitude provided (Anchorage, Alaska) To change the location, just change the latitude and longitude value at CLLocationCoordinate2D coord = {latitude: value, longitude: value};
Post edited by iamsgtyang on

Replies

  • PhilipsPhilips Posts: 8New Users
    edited October 2010
    This was the most straight forward and easy to understand work-through I have come across. Most tutorials try to add a number of 'bells and whistles' from the start which makes it very difficult to apply the material in new contexts.

    Anyway, thank you. All I need now is to disentangle the issue of adding 'annotations'!
  • AnsAns Posts: 3New Users
    edited December 2010
    very helpful tutorial. one very minor correction. add #import <MapKit/MapKit.h> in .m file too..
    can anyone tell how to get location so that when map load it focus on my location at startup.

    aasims.wordpress.com
  • dogancoruhdogancoruh Posts: 1New Users
    edited December 2010
    For sure, this is the best and straight forward explanation of MKMapView component for a newbie as Philips said. Thanks for quality material for all

    dogancoruh.blogspot.com
  • Sammy42Sammy42 Posts: 3New Users
    edited February 2011
    For some reason I get 'mapView' undeclared? With the code:

    mapView=[[MKMapView alloc] initWithFrame:self.view.bounds];

    Anybody know why?
  • khalilskhalils Posts: 1New Users
    edited February 2011
    Sammy42 wrote: »
    For some reason I get 'mapView' undeclared? With the code:

    mapView=[[MKMapView alloc] initWithFrame:self.view.bounds];

    Anybody know why?

    Did u declare the mapView in the header file?
  • jonthornhamjonthornham Posts: 25Registered Users
    edited July 2011
    Awesome post. Thanks for taking the time to put it up.

    Jon
Sign In or Register to comment.