iphone 地图加注释

成员变量建立outlets的关系（什么？不懂？那就从头学一下xcode吧）。

在类的实现文件（.m)中加入以下代码（方法名自己起吧，我这里起的是initMapView）：

view plain copy to clipboard print ?

1. - (void) initMapView { 
2.     MKCoordinateSpan theSpan; 
3.     //设置地图的范围，越小越精确 
4.     theSpan.latitudeDelta = 0.02; 
5.     theSpan.longitudeDelta = 0.02; 
6.     MKCoordinateRegion theRegion; 
7.     theRegion.center = [checkinLocation coordinate]; //让地图跳到之前获取到的当前位置checkinLocation 
8.     theRegion.span = theSpan; 
9.     [mapView setRegion:theRegion]; 
10. } 

- (void) initMapView { MKCoordinateSpan theSpan; //设置地图的范围，越小越精确 theSpan.latitudeDelta = 0.02; theSpan.longitudeDelta = 0.02; MKCoordinateRegion theRegion; theRegion.center = [checkinLocation coordinate]; //让地图跳到之前获取到的当前位置checkinLocation theRegion.span = theSpan; [mapView setRegion:theRegion]; }
然后，你在显示这个View的时候（比如在viewDidLoad函数中）调用initMapView，地图便可以跳到你要显示的位置了。这里关键的函数是setRegion，已经被MKMapView类封装好了。

至此，你的应用就可以显示地图，并且跳到你设定的任何位置了。是不是特简单？简直简单到我在怀疑我是否有写这篇文章的需要了。不过，废话少说。下面还是来看看如何自定义Annotation吧。

===自定义Annotation===

如果不采取自定义的Annotation，ios默认的是一个图钉的形状，如下图（一个紫色的图钉）：

当然，千里执行始于足下，我们还是首先来看看如何在特定的位置显示以上的默认的小图钉吧。

第一步：

先定义一个自己的Annotation的类：

view plain copy to clipboard print ?

1. @interface MyMapAnnotation : NSObject<MKAnnotation> { 
2.     CLLocationCoordinate2D location; 
3.     NSString *title; 
4.     NSString *subtitle; 
5.     NSString *headImage; 
6. } 
7.  
8. @property CLLocationCoordinate2D location; 
9. @property (nonatomic, copy) NSString *title; 
10. @property (nonatomic, copy) NSString *subtitle; 
11. @property (nonatomic, copy) NSString *headImage; 
12.  
13. @end 

@interface MyMapAnnotation : NSObject<MKAnnotation> { CLLocationCoordinate2D location; NSString *title; NSString *subtitle; NSString *headImage; } @property CLLocationCoordinate2D location; @property (nonatomic, copy) NSString *title; @property (nonatomic, copy) NSString *subtitle; @property (nonatomic, copy) NSString *headImage; @end从上面代码可以看到，MyMapAnnotation类继承于MKAnnotation。里面包含四个成员变量。其中location保存要显示这个Annotation的位置。其他三个变量对应我们之前那个效果图的几点内容：头像、文字内容。

这个类的实现文件（.m)文件很简单，就定义好dealloc和init方法就好，这里不再赘述。

第二步：

在要显示地图的View类中实现MKMapViewDelegate，并实现viewForAnnotation函数，代码如下：

view plain copy to clipboard print ?

1. - (MKAnnotationView *)mapView:(MKMapView *)theMapView viewForAnnotation:(id <MKAnnotation>)annotation { 
2.     if ([annotation isKindOfClass:[MKUserLocation class]]) 
3.         return nil; 
4.     // 处理我们自定义的Annotation 
5.     if ([annotation isKindOfClass:[MyMapAnnotation class]]) {   
6.         static NSString* travellerAnnotationIdentifier = @"TravellerAnnotationIdentifier"; 
7.         MKPinAnnotationView* pinView = (MKPinAnnotationView *) 
8.         [mapView dequeueReusableAnnotationViewWithIdentifier:travellerAnnotationIdentifier]; 
9.         if (!pinView) 
10.         { 
11.             // if an existing pin view was not available, create one 
12.             MKAnnotationView* customPinView = [[[MKAnnotationView alloc] 
13.                                                 initWithAnnotation:annotation reuseIdentifier:travellerAnnotationIdentifier] autorelease]; 
14.             customPinView.pinColor = MKPinAnnotationColorPurple; 
15.             customPinView.animatesDrop = YES;  //如果不需要这个从天而降的效果，设置为NO即可。 
16.             customPinView.canShowCallout = NO; 
17.             return customPinView; 
18.         } 
19.         else 
20.         { 
21.             pinView.annotation = annotation; 
22.         } 
23.         return pinView; 
24.     } 
25.     return nil; 
26. } 

- (MKAnnotationView *)mapView:(MKMapView *)theMapView viewForAnnotation:(id <MKAnnotation>)annotation { if ([annotation isKindOfClass:[MKUserLocation class]]) return nil; // 处理我们自定义的Annotation if ([annotation isKindOfClass:[MyMapAnnotation class]]) { static NSString* travellerAnnotationIdentifier = @"TravellerAnnotationIdentifier"; MKPinAnnotationView* pinView = (MKPinAnnotationView *) [mapView dequeueReusableAnnotationViewWithIdentifier:travellerAnnotationIdentifier]; if (!pinView) { // if an existing pin view was not available, create one MKAnnotationView* customPinView = [[[MKAnnotationView alloc] initWithAnnotation:annotation reuseIdentifier:travellerAnnotationIdentifier] autorelease]; customPinView.pinColor = MKPinAnnotationColorPurple; customPinView.animatesDrop = YES; //如果不需要这个从天而降的效果，设置为NO即可。 customPinView.canShowCallout = NO; return customPinView; } else { pinView.annotation = annotation; } return pinView; } return nil; }
这段代码将实现默认的一个图钉的效果。

细心地你会发现，上面的代码似乎没有涉及到地理位置，那么地图将怎么知道将这个Annotation放到合适的位置呢？稍安勿躁，稍候将会介绍如何设置Annotation的位置，同时设置Annotation的其他内容（还记得Annotation的定义里面有位置信息，还有几项内容信息吧）。

如果我不喜欢图钉，我想把它换成之前效果图中的笑脸呢？那就把上述代码改成如下：

view plain copy to clipboard print ?

1. - (MKAnnotationView *)mapView:(MKMapView *)theMapView viewForAnnotation:(id <MKAnnotation>)annotation { 
2.     if ([annotation isKindOfClass:[MKUserLocation class]]) 
3.         return nil; 
4.     if ([annotation isKindOfClass:[TravellerMapAnnotation class]]) {    
5.         static NSString* travellerAnnotationIdentifier = @"TravellerAnnotationIdentifier"; 
6.         MKPinAnnotationView* pinView = (MKPinAnnotationView *) 
7.         [mapView dequeueReusableAnnotationViewWithIdentifier:travellerAnnotationIdentifier]; 
8.         if (!pinView) 
9.         { 
10.             // if an existing pin view was not available, create one 
11.             MKAnnotationView* customPinView = [[[MKAnnotationView alloc] 
12.                                                 initWithAnnotation:annotation reuseIdentifier:travellerAnnotationIdentifier] autorelease];  
13.             UIImage *image = [UIImage imageNamed:@"smileFace.png"]; 
14.             customPinView.image = image;  //将图钉变成笑脸。 
15.             [image release]; 
16.             return customPinView; 
17.         } 
18.         else 
19.         { 
20.             pinView.annotation = annotation; 
21.         } 
22.         return pinView; 
23.     } 
24.     return nil; 
25. } 

- (MKAnnotationView *)mapView:(MKMapView *)theMapView viewForAnnotation:(id <MKAnnotation>)annotation { if ([annotation isKindOfClass:[MKUserLocation class]]) return nil; if ([annotation isKindOfClass:[TravellerMapAnnotation class]]) { static NSString* travellerAnnotationIdentifier = @"TravellerAnnotationIdentifier"; MKPinAnnotationView* pinView = (MKPinAnnotationView *) [mapView dequeueReusableAnnotationViewWithIdentifier:travellerAnnotationIdentifier]; if (!pinView) { // if an existing pin view was not available, create one MKAnnotationView* customPinView = [[[MKAnnotationView alloc] initWithAnnotation:annotation reuseIdentifier:travellerAnnotationIdentifier] autorelease]; UIImage *image = [UIImage imageNamed:@"smileFace.png"]; customPinView.image = image; //将图钉变成笑脸。 [image release]; return customPinView; } else { pinView.annotation = annotation; } return pinView; } return nil; }

从上述代码看出，也就是将定义pinColor的代码段去掉，换成设置image的代码：customPinView.image = image.

同样很简单吧。哎，我还有没有写下去的必要呢。（画外音：废话少说！！！）

第三步：

正如之前的疑问，哪里定义Annotation的地理位置以及其他内容呢？不仅仅如此，还有，怎么让用户点击笑脸（或者图钉）之后，弹出一个标签，显示定义好的内容呢。下面我们先看看最后一个问题，怎么让用户点击笑脸（或者图钉）之后，弹出一个标签，显示定义好的内容呢？

还是上面那段代,将它进一步改成：

view plain copy to clipboard print ?

1. - (MKAnnotationView *)mapView:(MKMapView *)theMapView viewForAnnotation:(id <MKAnnotation>)annotation { 
2.     if ([annotation isKindOfClass:[MKUserLocation class]]) 
3.         return nil; 
4.     if ([annotation isKindOfClass:[TravellerMapAnnotation class]]) {  
5.         // try to dequeue an existing pin view first 
6.         static NSString* travellerAnnotationIdentifier = @"TravellerAnnotationIdentifier"; 
7.         MKPinAnnotationView* pinView = (MKPinAnnotationView *) 
8.         [mapView dequeueReusableAnnotationViewWithIdentifier:travellerAnnotationIdentifier]; 
9.         if (!pinView) 
10.         { 
11.             // if an existing pin view was not available, create one 
12.             MKAnnotationView* customPinView = [[[MKAnnotationView alloc] 
13.                                                 initWithAnnotation:annotation reuseIdentifier:travellerAnnotationIdentifier] autorelease]; 
14.             customPinView.canShowCallout = YES;  //很重要，运行点击弹出标签 
15.             UIButton* rightButton = [UIButton buttonWithType:UIButtonTypeDetailDisclosure]; 
16.             [rightButton addTarget:self 
17.                             action:@selector(showDetails:)  //点击右边的按钮之后，显示另外一个页面 
18.                             forControlEvents:UIControlEventTouchUpInside]; 
19.             customPinView.rightCalloutAccessoryView = rightButton; 
20.             MyMapAnnotation *travellerAnnotation = (TravellerMapAnnotation *)annotation; 
21.             UIImageView *headImage = [[UIImageView alloc] initWithImage:[UIImage imageNamed:travellerAnnotation.headImage]]; 
22.             customPinView.leftCalloutAccessoryView = headImage; //设置最左边的头像 
23.             [headImage release]; 
24.             UIImage *image = [UIImage imageNamed:@"smileFace.png"]; 
25.             customPinView.image = image; 
26.             customPinView.opaque = YES; 
27.             [travellerImage release]; 
28.             return customPinView; 
29.         } 
30.         else 
31.         { 
32.             pinView.annotation = annotation; 
33.         } 
34.         return pinView; 
35.     } 
36.     return nil; 
37. } 

- (MKAnnotationView *)mapView:(MKMapView *)theMapView viewForAnnotation:(id <MKAnnotation>)annotation { if ([annotation isKindOfClass:[MKUserLocation class]]) return nil; if ([annotation isKindOfClass:[TravellerMapAnnotation class]]) { // try to dequeue an existing pin view first static NSString* travellerAnnotationIdentifier = @"TravellerAnnotationIdentifier"; MKPinAnnotationView* pinView = (MKPinAnnotationView *) [mapView dequeueReusableAnnotationViewWithIdentifier:travellerAnnotationIdentifier]; if (!pinView) { // if an existing pin view was not available, create one MKAnnotationView* customPinView = [[[MKAnnotationView alloc] initWithAnnotation:annotation reuseIdentifier:travellerAnnotationIdentifier] autorelease]; customPinView.canShowCallout = YES; //很重要，运行点击弹出标签 UIButton* rightButton = [UIButton buttonWithType:UIButtonTypeDetailDisclosure]; [rightButton addTarget:self action:@selector(showDetails:) //点击右边的按钮之后，显示另外一个页面 forControlEvents:UIControlEventTouchUpInside]; customPinView.rightCalloutAccessoryView = rightButton; MyMapAnnotation *travellerAnnotation = (TravellerMapAnnotation *)annotation; UIImageView *headImage = [[UIImageView alloc] initWithImage:[UIImage imageNamed:travellerAnnotation.headImage]]; customPinView.leftCalloutAccessoryView = headImage; //设置最左边的头像 [headImage release]; UIImage *image = [UIImage imageNamed:@"smileFace.png"]; customPinView.image = image; customPinView.opaque = YES; [travellerImage release]; return customPinView; } else { pinView.annotation = annotation; } return pinView; } return nil; }上面的代码很容易理解（加上我的注释之后），有点objective-C以及cocoa基础的朋友都会看懂。如果你看不懂，拜托，我这里不负责扫盲啊。

也许你有个疑问，似乎没见到设置文字信息呀。其实，之前自定义的MyMapAnnotation继承自MKAnnotation，所以只要你给一个MyMapAnnotation对象的title和subtitle填上内容之后，它会自动显示，不需要你手动让它显示。

下面我们就来看看如何添加MyMapAnnotation的内容吧。

其实这也十分简单，就是创建一个新的MyMapAnnotation，然后往里面添加内容即可。比如：

view plain copy to clipboard print ?

1. TravellerMapAnnotation *travellerAnnotation = [[TravellerMapAnnotation alloc] init]; 
2. travellerAnnotation.location = checkinlocation.coordinate; 
3. travellerAnnotation.title = [travellerNames objectAtIndex:i]; 
4. travellerAnnotation.subtitle = [scores objectAtIndex:i]; 
5. travellerAnnotation.headImage = [headImages objectAtIndex:i]; 

TravellerMapAnnotation *travellerAnnotation = [[TravellerMapAnnotation alloc] init]; travellerAnnotation.location = checkinlocation.coordinate; travellerAnnotation.title = [travellerNames objectAtIndex:i]; travellerAnnotation.subtitle = [scores objectAtIndex:i]; travellerAnnotation.headImage = [headImages objectAtIndex:i];

现在还残留的一个问题是（这是历史遗留的问题，由于某种原因，我们暂时忽略了它。。。！跑题了吧，大叔。。。）：

如何将创建好的一个或者多个甚至成千上万个MyMapAnnotation加入地图并显示它呢。

这个问题更加简单。加入建立了100个MyMapAnnotations，并且全部存进了一个NSArray中，MyMapAnnotationsArray，那么我们需要做的就十分简单了：

mapView addAnnotations:MyMapAnnotationsArray

也就是调用MKMapView的addAnnotations方法将所有创建好的Annotations加进来即可。

至此（真的是至此了），所有的工作都完成了。调试，便可看到一开头展示的那个效果了。（呼，好累）。

基础性的技术文章不好写，写得详细太累人，写得简单怕误导别人，sigh。