How to track a user's location and display the path travelled using Google Maps ios SDK

6
votes

I'm currently building an ios app and I'm hoping to implement a function where the user's location is displayed on a Google Map view and when they move a polyline show's the path that has been travelled by the user so far. This obviously needs to happen in realtime.

So far I've initialised a Google Maps view and can display the user's current location using the observeValueForKeyPath function. The view and location marker update as the user moves.

I figured the best way to do this would be to create a GMSMutablePath object that adds the user's current location every time the map camera updates to the new location and then create a polyline from that path. The code I've used for this is below:

- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context
{
    if ([keyPath isEqualToString:@"myLocation"] && [object isKindOfClass:[GMSMapView class]])
    {
        [self.myMapView animateToCameraPosition:[GMSCameraPosition cameraWithLatitude:self.myMapView.myLocation.coordinate.latitude
                                                                                 longitude:self.myMapView.myLocation.coordinate.longitude
                                                                                      zoom:18]];


        [trackedPath addCoordinate:CLLocationCoordinate2DMake(self.myMapView.myLocation.coordinate.latitude, self.myMapView.myLocation.coordinate.longitude)];
        GMSPolyline *testPoly = [GMSPolyline polylineWithPath:trackedPath];
        testPoly.strokeWidth = 8;
        testPoly.strokeColor = [UIColor redColor];
        testPoly.map = myMapView;
    }
}

This doesn't produce any polyline on the map in practice so any help/advice would be much appreciated!

2
iosgoogle-mapsgoogle-maps-sdk-iospolyline

2 Answers

8
votes
- (void)locationManager:(CLLocationManager *)manager didUpdateToLocation:(CLLocation *)newLocation fromLocation:(CLLocation *)oldLocation{  NSString *pointString=[NSString    stringWithFormat:@"%f,%f",newLocation.coordinate.latitude,newLocation.coordinate.longitude];
    [self.points addObject:pointString];
GMSMutablePath *path = [GMSMutablePath path];
for (int i=0; i<self.points.count; i++)
{           
  NSArray *latlongArray = [[self.points   objectAtIndex:i]componentsSeparatedByCharactersInSet:[NSCharacterSet characterSetWithCharactersInString:@","]];

[path addLatitude:[[latlongArray objectAtIndex:0] doubleValue] longitude:[[latlongArray objectAtIndex:1] doubleValue]];
 }

if (self.points.count>2)
{
    GMSPolyline *polyline = [GMSPolyline polylineWithPath:path];
    polyline.strokeColor = [UIColor blueColor];
    polyline.strokeWidth = 5.f;
    polyline.map = mapView_;
    self.view = mapView_;
}}
2
votes

If you want to draw two path BTW two place use this method. its demo swift methods to find rout of two places.

//MARK: API CALL
func GetRoughtofTwoLocation(){
    let originString: String = "\(23.5800),\(72.5853)"
    let destinationString: String = "\(24.5836),\(72.5853)"
    let directionsAPI: String = "https://maps.googleapis.com/maps/api/directions/json?"
    let directionsUrlString: String = "\(directionsAPI)&origin=\(originString)&destination=\(destinationString)&mode=driving"

    APICall().callApiUsingWithFixURLGET(directionsUrlString, withLoader: true) { (responceData) -> Void in
        let json = responceData as! NSDictionary
        let routesArray: [AnyObject] = (json["routes"] as! [AnyObject])
        var polyline: GMSPolyline? = nil
        if routesArray.count > 0 {
            let routeDict: [NSObject : AnyObject] = routesArray[0] as! [NSObject : AnyObject]
            var routeOverviewPolyline: [NSObject : AnyObject] = (routeDict["overview_polyline"] as! [NSObject : AnyObject])
            let points: String = (routeOverviewPolyline["points"] as! String)
            let path: GMSPath = GMSPath(fromEncodedPath: points)!
            polyline = GMSPolyline(path: path)
            polyline!.strokeWidth = 2.0
            polyline!.map = self.mapView
        }

    }
}