If you use UIWebView, you can use javascript and get functionality for free, because, as you said, MapKit does not provide this functionality. It's pretty simple, check out this google maps guide for the basics . Of course, this way you get the pros and cons of html and javascript.
You just write your javascript code in html (here map.html ), which you put in the project folder, and initiate this html file like this.
NSString *html = [[NSString alloc] initWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"map" ofType:@"html"] encoding:NSUTF8StringEncoding error:&error]; [self.mapView loadHTMLString:html baseURL:[NSURL fileURLWithPath:[[NSBundle mainBundle] bundlePath]]];
You call the javascript function from objective-c as follows. here in map.html there is a javascript function called setMarkerAtPosition(latitude, longitude) . pretty straight forward.
[self.mapView stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:@"setMarkerAtPosition(%f,%f)",latlong.latitude, latlong.longitude]];
Change by request:
You add a UIWebView and connect it to the controller (if you don’t know how to do this, you should definitely step back from this and do some basic tutorials) (remember to synthesize mapView again. If you don’t know what it is, basic reading)
Then put the following code in your viewDidLoad method. It creates an NSString and initializes it with the contents of your local html file (as already published). Then you call the loadHTMLString method of your UIWebView. The html line is based on your local html map.html file (just name it and just drag it into your project if you haven't added it yet).
- (void)viewDidLoad { [super viewDidLoad]; NSError *error = nil; // create NSString from local HTML file and add it to the webView NSString *html = [[NSString alloc] initWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"map" ofType:@"html"] encoding:NSUTF8StringEncoding error:&error]; [self.mapView loadHTMLString:html baseURL:[NSURL fileURLWithPath:[[NSBundle mainBundle] bundlePath]]]; [self.view sendSubviewToBack:self.mapView]; }
Then add a button to your view (interface designer, you need to know how) and connect it to the method. Put this code inside this method (by the way, this will give you a route in Germany)
[self.mapView stringByEvaluatingJavaScriptFromString:@"calculateRoute(50.777682, 6.077163, 50.779347, 6.059429)"];
Finally, use this as the contents of your map.html file (note: it also has some useless things, but you can figure it out later. I deleted all the code that you don't need to display the route, but a lot of things are useless in the header) :
<html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> <script type="text/javascript" src="http://maps.google.de/maps/api/js?sensor=false®ion=DE"></script> <script src="http://www.google.com/jsapi"></script> <script src="http://code.jquery.com/jquery-1.7.2.js"></script> <script src="json.js"></script> <script type="text/javascript">google.load("jquery", "1");</script> <script type="text/javascript"> google.load("maps", "3", {other_params:"sensor=false"}); </script> <script type="text/javascript"> </script> </head> <body onload="getCurrentLocation()"> <div id="map_canvas" style="width:100%; height:100%"> </body> </html>