How do i animate GMSPolyline in google maps ios -

i using google maps sdk , have draw polyline when user moves, animates marker only, path drawn before pin moves specific location. have draw path , move pin @ same time.

check video : https://www.dropbox.com/s/q5kdjf4iq0337vg/map_sample.mov?dl=0

here code

func locationmanager(manager: cllocationmanager, didupdatelocations locations: [cllocation]) {         let location = locations.last!         userpath.addcoordinate(location.coordinate) //userpath -> gmsmutablepath         let polyline = gmspolyline(path: userpath)         polyline.strokecolor = uicolor(red: 0, green: 191/255.0, blue: 1, alpha: 0.8)         polyline.strokewidth = 5         catransaction.begin()         catransaction.setanimationduration(2.0)         self.usermarker.position = location.coordinate         self.usermarker.rotation = location.course         polyline.map = self.googlemapview         catransaction.commit()     } 

also here screenshot how works

i trying similar thing (https://youtu.be/jej2xtwrqy8).

tried animating gmspolyline path in number of ways , failed animate directly.

how ever found alternative this. got create cashapelayer breizerpath, fake gmspolyline , animate strokeend. once animation completed, show actual gmspolyline , remove cashapelayer. have optimise it.

in order create cashapelayer, , point of start, lines can refer below code.

-(cashapelayer *)layerfromgmsmutablepath:(gmsmutablepath *)path{     uibezierpath *breizerpath = [uibezierpath bezierpath];      cllocationcoordinate2d firstcoordinate = [path coordinateatindex:0];     [breizerpath movetopoint:[_mapview.projection pointforcoordinate:firstcoordinate]];      for(int i=1; i<path.count; i++){         cllocationcoordinate2d coordinate = [path coordinateatindex:i];         [breizerpath addlinetopoint:[_mapview.projection pointforcoordinate:coordinate]];     }      cashapelayer *shapelayer = [cashapelayer layer];     shapelayer.path = [[breizerpath bezierpathbyreversingpath] cgpath];     shapelayer.strokecolor = [[uicolor whitecolor] cgcolor];     shapelayer.linewidth = 4.0;     shapelayer.fillcolor = [[uicolor clearcolor] cgcolor];     shapelayer.linejoin = kcalinejoinround;     shapelayer.linecap = kcalinecapround;     shapelayer.cornerradius = 5;      return shapelayer; } 

below code animate.

-(void)animatepath:(cashapelayer *)layer{     cabasicanimation *pathanimation = [cabasicanimation animationwithkeypath:@"strokeend"];     pathanimation.duration = 3;     pathanimation.delegate = self;     [pathanimation settimingfunction:[camediatimingfunction functionwithname:kcamediatimingfunctioneaseout]];     pathanimation.fromvalue = [nsnumber numberwithfloat:0.0f];     pathanimation.tovalue = [nsnumber numberwithfloat:1.0f];     [layer addanimation:pathanimation forkey:@"strokeend"]; } 

how ever in case had animate entire route. in case have animate updated part.