Move and Rotate GMSMarker smoothly along last updated GPS coordinates Swift iOS

Question

I'm using GMSMapView. So I added custom GMSMarker and set the image(Ex. Bike image) and animating that marker when user starts moving and changing the angle of the marker in locationManager .

Currently I'm just updating position attribute of GMSMarker. But it gives the GMSMarker jump effect. Instead of this I want to move and rotate the GMSMarker smoothly/properly into the GMSMapView.

How can i achieve this in Swift? Thanks.

   (void)updateLocationoordinates(CLLocationCoordinate2D) coordinates
    { 
     if (marker == nil) {
      marker = [GMSMarker markerWithPosition:coordinates];
      marker.icon = [UIImage imageNamed:IMAGE];
      marker.map = mapView;
    } else{
     marker.position = coordinates; 
          }
    }  

Answer 1

I've faced the same problem and tried many ways. At last I've came up with a solution - to take angle between previous location point and present location point and I've used an UIImageView instead of GMSMarker.

//in location update method
CGPoint anglepoint = [myMapView.projection pointForCoordinate:currLocation.coordinate];
CGFloat angle = [self getAngle:anglepoint];
if(!isnan(angle)){
     [UIView beginAnimations:nil context:nil];
     [UIView setAnimationDuration:0.8f];
     sampleImgView.transform = CGAffineTransformMakeRotation(angle);
     [sampleImgView setCenter:[myMapView.projection pointForCoordinate:CLLocationCoordinate2DMake(currLocation.coordinate.latitude, currLocation.coordinate.longitude)]];
     [UIView commitAnimations];
     prevCurrLocation = currLocation;
}


-(CGFloat) getAngle: (CGPoint) touchedPoints
{
    CGPoint previousLocationPoint = [myMapView.projection pointForCoordinate:prevCurrLocation.coordinate];

    CGFloat x1 = previousLocationPoint.x;
    CGFloat y1 = previousLocationPoint.y;

    CGFloat x2 = touchedPoints.x;
    CGFloat y2 = touchedPoints.y;

    CGFloat x3 = x1;
    CGFloat y3 = y2;

    CGFloat oppSide = sqrtf(((x2-x3)*(x2-x3)) + ((y2-y3)*(y2-y3)));
    CGFloat adjSide = sqrtf(((x1-x3)*(x1-x3)) + ((y1-y3)*(y1-y3)));

    CGFloat angle = atanf(oppSide/adjSide);
    // Quadrant Identifiaction
    if(x2 < previousLocationPoint.x)
    {
        angle = 0-angle;
    }


    if(y2 > previousLocationPoint.y)
    {
        angle = M_PI/2 + (M_PI/2 -angle);
    }
    return angle;
}

Use this for animation:

[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.5f];
sampleImgView.transform = CGAffineTransformMakeRotation(angle);
[sampleImgView setCenter:[myMapView.projection pointForCoordinate:CLLocationCoordinate2DMake(currLocation.coordinate.latitude, currLocation.coordinate.longitude)]];
[UIView commitAnimations];

Here is the sample Imageview:

sampleImgView = [[UIImageView alloc]init];
sampleImgView.center = myMapView.center;
sampleImgView.frame = CGRectMake(0,0, 25, 50);
sampleImgView.backgroundColor = [UIColor clearColor];
[myMapView addSubview:sampleImgView];

Hope this helps.