map with photos like Instagram Photo Map

Question

I'm trying to create a Map with photos kind of like Instagrams Photo Map.

Photo Map: https://i.stack.imgur.com/B0wDa.jpg

How can I get the Image (loaded from Parse), to the annotation, like in the screenshot above?

And this is what I got so far: MapViewController.m

[PFGeoPoint geoPointForCurrentLocationInBackground:^(PFGeoPoint *geoPoint, NSError *error) {
        PFQuery *query = [PFQuery queryWithClassName: @"HomePopulation"];
        [query whereKey:@"geopoint" nearGeoPoint:geoPoint withinKilometers:3000];
        [query findObjectsInBackgroundWithBlock:^(NSArray *objects, NSError *error) {
            if (!error) {
                for (PFObject *object in objects) {
                     PFGeoPoint *thePoint = [object objectForKey:@"geopoint"];
                    latitude = thePoint.latitude;
                    longitude = thePoint.longitude;

                    NSLog(@" Hej %f, %f", latitude, longitude);
                    CLLocationCoordinate2D annotationCoordinate = CLLocationCoordinate2DMake(latitude, longitude);

                    Annotation *annotation = [[Annotation alloc] init];
                    annotation.coordinate = annotationCoordinate;
                    annotation.title = [object objectForKey:@"discovery"];
                    annotation.subtitle = [object objectForKey:@"location"];

                    PFFile *image = [object objectForKey:@"imageFile"];
                    annotation.imageView.file = image;
                    [annotation.imageView loadInBackground];

                    [self.theMap addAnnotation:annotation];

                    [self.theMap setCenterCoordinate:annotation.coordinate animated:YES];

                    [self setNeedsStatusBarAppearanceUpdate];
                }
            }
        }];
    }];

Any help appreciated. Marko

Answer 1

With the help of this discussion: Custom annotations with same image

I came out with this:

Here's the code:

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


@interface MapViewController : UIViewController <MKMapViewDelegate>

@property double latitude;
@property double longitude;


@end

MapViewController.m
- (void)viewDidLoad
{
    [super viewDidLoad];

    [self.navigationController setNavigationBarHidden:YES animated:YES];
    self.theMap.delegate = self;
    self.theMap.showsUserLocation = YES;

    [PFGeoPoint geoPointForCurrentLocationInBackground:^(PFGeoPoint *geoPoint, NSError *error) {
        PFQuery *query = [PFQuery queryWithClassName: @"HomePopulation"];
        [query whereKey:@"geopoint" nearGeoPoint:geoPoint withinKilometers:1000];
        [query findObjectsInBackgroundWithBlock:^(NSArray *objects, NSError *error) {
            if (!error) {
                for (PFObject *object in objects) {
                     PFGeoPoint *thePoint = [object objectForKey:@"geopoint"];
                    latitude = thePoint.latitude;
                    longitude = thePoint.longitude;

                    NSLog(@" Hej %f, %f", latitude, longitude);
                    CLLocationCoordinate2D annotationCoordinate = CLLocationCoordinate2DMake(latitude, longitude);

                    Annotation *annotation = [[Annotation alloc] init];
                    annotation.coordinate = annotationCoordinate;
                    annotation.title = [object objectForKey:@"discovery"];
                    annotation.subtitle = [object objectForKey:@"location"];
                    annotation.objectID = object.objectId;

                    [self.theMap addAnnotation:annotation];
                }
            }
        }];
    }];

    //[self.theMap reloadInputViews];
}

- (MKAnnotationView *) mapView:(MKMapView *)mapView viewForAnnotation:(id<MKAnnotation>)annotation
{
    static NSString *identifier = @"theLocation";
    if ([annotation isKindOfClass:[Annotation class]]) {
        MKPinAnnotationView *annotationView = (MKPinAnnotationView *)[self.theMap dequeueReusableAnnotationViewWithIdentifier:identifier];

        if (annotationView == nil) {
            annotationView = [[MKPinAnnotationView alloc] initWithAnnotation:annotation reuseIdentifier:identifier];
        } else {
            annotationView.annotation = annotation;
        }
        annotationView.enabled = YES;
        //annotationView.canShowCallout = YES;

        UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(-40, -100, 100, 100)];
        imageView.contentMode = UIViewContentModeScaleAspectFit;

        NSString *id = [(Annotation *)annotationView.annotation objectID];

        PFQuery *query = [PFQuery queryWithClassName:@"HomePopulation"];
        [query getObjectInBackgroundWithId:[NSString stringWithFormat:@"%@", id] block:^(PFObject *object, NSError *error) {
            PFFile *file = [object objectForKey:@"imageFile"];
            [file getDataInBackgroundWithBlock:^(NSData *data, NSError *error) {
                imageView.image = [UIImage imageWithData:data];
            }];
        }];
        annotationView.image = [UIImage imageNamed:@"pointer"];
        [annotationView addSubview:imageView];

        return annotationView;
    }
    return nil;
}

Annotation.h
#import <Foundation/Foundation.h>
#import <MapKit/MapKit.h>
#import <Parse/Parse.h>

@interface Annotation : NSObject <MKAnnotation>

@property (nonatomic) CLLocationCoordinate2D coordinate;
@property (nonatomic, copy) NSString *title;
@property (nonatomic, copy) NSString *subtitle;
@property (nonatomic, copy) NSString *objectID;


@end