How to set image on MKAnnotation in MKMapView

Question

I am developing an app for chating, I have to display all friends on a Map with their image. Please provide guidance to implement it.

I have used following code...

- (MKAnnotationView *)mapView:(MKMapView *)mapView viewForAnnotation:(id <MKAnnotation>)annotation
 {

MKPinAnnotationView *annView = [[MKPinAnnotationView alloc]init]; 
UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"Done.png"]];

annView.animatesDrop = TRUE;
annView.canShowCallout = YES;
annView.calloutOffset = CGPointMake(-5, 5);
[annView addSubview:imageView];
return annView;
 }

Thanks

Answer 1

What you are doing wrong is you are returning object of class MKPinAnnotationView, which is used for displaying pin-annotation.

You should use object of MKAnnotationView class. Then, customise it by changing its image:

annotationView.image = [UIImage imageNamed:@"friend_image.png"];

Now, you can get your friend's photo instead of default pin image.

Below is full code solving your problem:

  - (MKAnnotationView *)mapView:(MKMapView *)map viewForAnnotation:(id <MKAnnotation>)annotation
    {
        static NSString *annotationViewReuseIdentifier = @"annotationViewReuseIdentifier";

        MKAnnotationView *annotationView = (MKAnnotationView *)[mapView dequeueReusableAnnotationViewWithIdentifier:annotationViewReuseIdentifier];

        if (annotationView == nil)
        {
            annotationView = [[[MKAnnotationView alloc] initWithAnnotation:annotation reuseIdentifier:annotationViewReuseIdentifier] autorelease];
        }

        // here you can assign your friend's image    
        annotationView.image = [UIImage imageNamed:@"friend_image.png"];
        annotationView.annotation = annotation;

        // add below line of code to enable selection on annotation view
        annotationView.canShowCallout = YES

        return annotationView;
    }

Answer 2

I have already posted one answer with different style annotation. But, if you want shown annotation as in above image, you have to use leftCalloutAccessoryView property of MKAnnotationView class as below:

-> First, create pinAnnotation and add it to mapView in viewDidLoad or where you created mapView:

    // Add the annotation to our map view
    MKPointAnnotation * pointAnnotation = [[MKPointAnnotation alloc] init];
    pointAnnotation.title = @"Rakesh Thummar";
    pointAnnotation.subtitle = @"Ahmedabad";
    pointAnnotation.coordinate = coord;
    [mapView addAnnotation:pointAnnotation];

-> Then, use leftCalloutAccessoryView property of MKAnnotationView class:

- (MKAnnotationView *)mapView:(MKMapView *)mapView viewForAnnotation:(id <MKAnnotation>)annotation
{
    static NSString *annotationViewReuseIdentifier = @"annotationViewReuseIdentifier";

    MKAnnotationView *annotationView = (MKAnnotationView *)[mapView dequeueReusableAnnotationViewWithIdentifier:annotationViewReuseIdentifier];

    if (annotationView == nil) {

        // if you want to show pinPoint create object of MKPinAnnotationView class instead of MKAnnotationView class
        annotationView = [[MKPinAnnotationView alloc] initWithAnnotation:annotation reuseIdentifier:annotationViewReuseIdentifier];
    }

    annotationView.canShowCallout = YES;

    // Add a custom image to the left side of the callout.
    UIImageView *myCustomImage = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"photo1_40.png"]];
    annotationView.leftCalloutAccessoryView = myCustomImage;

    return annotationView;
}

Answer 3

try this code..just..

annotationView.image=[UIImage imageNamed:@"red_point.png"];

and remove annView.animatesDrop = TRUE; code

- (MKAnnotationView *)mapView:(MKMapView *)mapView viewForAnnotation:(id <MKAnnotation>)annotation {

    //Define our reuse indentifier.
    static NSString *identifier = @"MapPoint";


    if ([annotation isKindOfClass:[MapPoint class]]) {

        MKPinAnnotationView *annotationView = (MKPinAnnotationView *) [self.map dequeueReusableAnnotationViewWithIdentifier:identifier];
        if (annotationView == nil) {
            annotationView = [[MKPinAnnotationView alloc] initWithAnnotation:annotation reuseIdentifier:identifier];
            UIButton *detailButton = [UIButton buttonWithType:UIButtonTypeDetailDisclosure];
            annotationView.leftCalloutAccessoryView=detailButton;
            annotationView.image=[UIImage imageNamed:@"red_point.png"];

        } else {
            annotationView.annotation = annotation;
        }

        annotationView.enabled = YES;
        annotationView.canShowCallout = YES;

        return annotationView;
    }

    return nil;
}

eidted:

 MKPinAnnotationView *annView = [[MKPinAnnotationView alloc]init]; 

     UIButton *detailButton = [UIButton buttonWithType:UIButtonTypeDetailDisclosure];
          annView.leftCalloutAccessoryView=detailButton;
    annView.image=[UIImage imageNamed:@"Done.png"];
    annView.canShowCallout = YES;
    annView.calloutOffset = CGPointMake(-5, 5);
    [annView addSubview:imageView];

Answer 4

Pleae use the below code.

- (MKAnnotationView *)mapView:(MKMapView *)mV viewForAnnotation:(id <MKAnnotation>)annotation 
{
    if ([annotation isKindOfClass:[MKUserLocation class]]) {
        return nil;
    }

    static NSString* MapAnnotationIdentifier = @"MapAnnotationIdentifier";
    MKAnnotationView* pinView = (MKAnnotationView *)[quakesMapView dequeueReusableAnnotationViewWithIdentifier:MapAnnotationIdentifier];  

    if (!pinView) {
        pinView = [self annotationViewForAnnotation:annotation withIdentifier:MapAnnotationIdentifier];
    }

 pinView.image = [UIImage imageNamed:YourImage];

    return pinView;

}

Answer 5

A swift4 version of Nitesh Borad Answer:

func mapView(_ map: MKMapView, viewFor annotation: MKAnnotation) -> MKAnnotationView? {
    let annotationViewReuseIdentifier = "annotationViewReuseIdentifier"

    var annotationView = mapView.dequeueReusableAnnotationView(withIdentifier: annotationViewReuseIdentifier) as? MKAnnotationView

    if annotationView == nil {
        annotationView = MKAnnotationView(annotation: annotation, reuseIdentifier: annotationViewReuseIdentifier)
    }

    // here you can assign your friend's image    
    annotationView?.image = UIImage(named: "friend_image.png")
    annotationView?.annotation = annotation

    // add below line of code to enable selection on annotation view
    annotationView?.canShowCallout = true

    return annotationView
}