Mapkit绘制路线问题

Question

I am developing an application in which I need to draw a route between two points using lat/long.

I have used google API to get polylines and drawing it after decoding it.

Problems:

1. Route is not in the middle of the road (Attached image_1)

2. While zooming in/out route doesn't draw completely (Attached image_2)

Below is the code:

    if(!routeView)
        routeView = [[UIImageView alloc] initWithFrame:CGRectMake(0, self.mapView.frame.origin.y, mapView.frame.size.width, self.mapView.frame.size.height)];
    routeView.userInteractionEnabled = NO;
    [mapView addSubview:routeView];

    [self.lat1 resignFirstResponder];
    [self.long1 resignFirstResponder];
    [self.lat2 resignFirstResponder];
    [self.long2 resignFirstResponder];

    NSString* saddr = [NSString stringWithFormat:@"%@,%@",self.lat1.text,self.long1.text];

    NSString* daddr = [NSString stringWithFormat:@"%@,%@",self.lat2.text,self.long2.text];

    NSString* apiUrlStr = [NSString stringWithFormat:@"http://maps.apple.com/maps/api/directions/json?origin=%@&destination=%@&sensor=false", saddr, daddr];

    NSURL* apiUrl = [NSURL URLWithString:apiUrlStr];

    NSError *error;
    NSString *apiResponse = [NSString stringWithContentsOfURL:apiUrl encoding:NSUTF8StringEncoding error:&error];


    NSData *responseData = [apiResponse dataUsingEncoding:NSUTF8StringEncoding];


    NSError* error1;
    NSDictionary* json = [NSJSONSerialization JSONObjectWithData:responseData
                                                         options:NSJSONReadingMutableLeaves
                                                           error:&error1];
    NSLog(@"Error: %@\n%@",[error1 localizedDescription],[error1 localizedFailureReason]);


   if([[json objectForKey:@"status"] isEqualToString:@"OK"])
    {
        NSArray *routes1 = [json objectForKey:@"routes"];
        NSDictionary *route = [routes1 lastObject];

        if (route)
        {
            NSString *overviewPolyline = [[route objectForKey: @"overview_polyline"] objectForKey:@"points"];

            routes = [self decodePolyLine:overviewPolyline];

            //NSLog(@"%@",[routes objectAtIndex:0]);

            [self updateRouteView];
            [self centerMap];
        }
    }


-(void) updateRouteView
{
 CGContextRef context =     CGBitmapContextCreate(nil,
                                                 routeView.frame.size.width,
                                              routeView.frame.size.height,
                                              8,
                                              4 * routeView.frame.size.width,
                                              CGColorSpaceCreateDeviceRGB(),
                                              kCGImageAlphaPremultipliedLast);

CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor);
CGContextSetRGBFillColor(context, 0.0, 0.0, 1.0, 1.0);
CGContextSetLineWidth(context, 3.0);

for(int i = 0; i < routes.count; i++) {
    CLLocation* location = [routes objectAtIndex:i];
    CGPoint point = [mapView convertCoordinate:location.coordinate toPointToView:routeView];

    if(i == 0) {
        CGContextMoveToPoint(context, point.x, routeView.frame.size.height - point.y);
    } else {
        CGContextAddLineToPoint(context, point.x, routeView.frame.size.height - point.y);
    }
}

CGContextStrokePath(context);

CGImageRef image = CGBitmapContextCreateImage(context);
UIImage* img = [UIImage imageWithCGImage:image];

routeView.image = img;
CGContextRelease(context);

}

Answer 1

One possible reason that your route is misaligned is that your route is coming rom Google ( http://maps.apple.com/maps redirects to http://maps.google.com/maps ) and you are drawing it on Apple's maps. Their data is slightly different.

The partially drawn route I can't solve, but I would suggest you add an MKPolyline rather than a static image overlay. They invented that line drawing tool for a good reason.