Geek Answers Handbook

Show Google Maps with UIWebView Zoom

MapKit does not support driving directions. therefore, I think I can show the direction of movement in the web view. I show google maps in uiwebview, but it shows the whole site on which I just want to show only a part of the map with some increase, so that it looks like the original iphone maps application. Also, I don’t know if this violates the Apple API rules for human interfaces (HIG), tell me if there is any.

+4
source share
2 answers

Download a line like NSString (perhaps separate the newlines). You can change latitude and longitude, zoom level, etc. Using stringWithFormat

 <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script> <script type="text/javascript"> function initialize() { var latlng = new google.maps.LatLng(35.000, 139.000); var myOptions = { zoom: 15, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); } </script> </head> <body onload="initialize()"> <div id="map_canvas" style="width:100%; height:100%"> </body> </html>

Then set the UIWebView html for this. It will give you a page with a map that allows you to scroll with your finger or zoom in, zoom in and place a marker.

Use this to download HTML:

 - (void)loadHTMLString:(NSString *)string baseURL:(NSURL *)baseURL
+7
source

Here you go. Pass it through stringWithFormat with doubled lat long duration and after the final lat long, all of them are like float:

[NSString stringWithformat: ..., oriLat, oriLon, oriLat, oriLon, destLat, destLon];

and then pass it to UIWebView

 <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script> <script type="text/javascript"> var directionsDisplay = new google.maps.DirectionsRenderer(); var directionsService = new google.maps.DirectionsService(); function initialize() { var latlng = new google.maps.LatLng(%f, %f); var myOptions = { zoom: 15, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); directionsDisplay.setMap(map); calcRoute(); } function calcRoute() { var start = new google.maps.LatLng(%f, %f); var end = new google.maps.LatLng(%f, %f); var request = { origin:start, destination:end, travelMode: google.maps.DirectionsTravelMode.DRIVING }; directionsService.route(request, function(result, status) { if (status == google.maps.DirectionsStatus.OK) { directionsDisplay.setDirections(result); } }); } </script> </head> <body onload="initialize()"> <div id="map_canvas" style="width:300px; height:300px"> </body> </html>
+4
source

More articles:


All Articles