Car (Annotation) animation (like uber app) not working

Question

I made one demo project (from Moving-MKAnnotationView demo on github) for moving car on map following is its link

https://github.com/pratikbhiyani/Moving-MKAnnotationView

I edit my code on the basis of given answer by vinaut but still problem is that when we zoom or scroll the map animation get distract in ios 7 and in ios 6 when we zoom or scroll the map annotation set to its original angle for a while.

Below is a screen shot of my Demo Project

Here is some code i change

- (void) setPosition : (id) posValue;
{
    NSLog(@"set position");

    //extract the mapPoint from this dummy (wrapper) CGPoint struct
    MKMapPoint mapPoint = *(MKMapPoint*)[(NSValue*)posValue pointerValue];

    CLLocationCoordinate2D coord = MKCoordinateForMapPoint(mapPoint);
    CGPoint toPos;
    if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 7) {

        toPos = [self.mapView convertCoordinate:coord toPointToView:self.mapView];
    }
    else
    {
        CGFloat zoomFactor =  self.mapView.visibleMapRect.size.width / self.mapView.bounds.size.width;
        toPos.x = mapPoint.x/zoomFactor;
        toPos.y = mapPoint.y/zoomFactor;
    }



    [self setTransform:CGAffineTransformMakeRotation([self getHeadingForDirectionFromCoordinate:MKCoordinateForMapPoint(previousPoint) toCoordinate: MKCoordinateForMapPoint(mapPoint)])];

    if (MKMapRectContainsPoint(self.mapView.visibleMapRect, mapPoint)) {

        CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"position"];

        animation.fromValue = [NSValue valueWithCGPoint:self.center];
        animation.toValue = [NSValue valueWithCGPoint:toPos];
        animation.duration = 1.0;
        animation.delegate = self;
        animation.fillMode = kCAFillModeForwards;
        //[self.layer removeAllAnimations];
        [self.layer addAnimation:animation forKey:POSITIONKEY];

        //NSLog(@"setPosition ANIMATED %x from (%f, %f) to (%f, %f)", self, self.center.x, self.center.y, toPos.x, toPos.y);
    }

    self.center = toPos;

    previousPoint = mapPoint;
}

My goal is to move car same like in uber app.

Answer 1

It seems that something changed with the conversion functions for CLCoordinate2D/MKMapPoint/CGPoint...

Detecting a point in a MKPolygon broke with iOS7 (CGPathContainsPoint)

The annotation disappears because the conversion beetween MkMapPoints and CGIPoints does not work anymore, if you log the "position" of the CALayer you will get points way outside the view. No idea why it works when doing touch events.

If you change the function to :

    - (void) setPosition : (id) posValue; 
{
    //extract the mapPoint from this dummy (wrapper) CGPoint struct
    MKMapPoint mapPoint = *(MKMapPoint*)[(NSValue*)posValue pointerValue];  
    CLLocationCoordinate2D coord = MKCoordinateForMapPoint(mapPoint);

    CGPoint toPos = [self.mapView convertCoordinate:coord toPointToView:self.mapView];


    if (MKMapRectContainsPoint(self.mapView.visibleMapRect, mapPoint)) {

        CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"position"];

        animation.fromValue = [NSValue valueWithCGPoint:self.center];
        animation.toValue = [NSValue valueWithCGPoint:toPos];   
        animation.duration = 0.8;
        animation.delegate = self;
        animation.fillMode = kCAFillModeForwards;
        //[self.layer removeAllAnimations];
        [self.layer addAnimation:animation forKey:POSITIONKEY];

        //NSLog(@"setPosition ANIMATED %x from (%f, %f) to (%f, %f)", self, self.center.x, self.center.y, toPos.x, toPos.y);
    }   

    self.center = toPos;


}

It should be working again.

Answer 2

I'm the original contributor to Moving-MKAnnotationView (https://github.com/100grams/Moving-MKAnnotationView.git). This component was originally written using iOS4.3 and a lot has changed since. :-)

The root cause here was the conversion from MKMapPoint to CGPoint (screen coordinates). Although the code worked before, it breaks on iOS7 and I fixed it by using this to convert the lat/lon coordinate to screen coordinates:

convertCoordinate:toPointToView:

I've committed this fix, with a few other updates, to https://github.com/100grams/Moving-MKAnnotationView.git so it now works on iOS7/Xcode5.

Answer 3

The problem of distracting a car while zoom/scrolling the map. Actually it can not be achieved by adding an animation to annotation. I have found out the Interpolate function through which I can get the locations between "From" and "To" coordinates and set it to the annotation(setting annotation coordinate in milliseconds) will look like an animation.

It is not an issue of iOS or Map, if you are adding animation to annotation it will add to annotation layer not respect to the map point.