Posted By

Meander365 on 09/15/10

Tagged

Versions (?)

Last Edited at 09/15/10 11:48am

Statistics

Viewed 942 times

Favorited by 1 user(s)

Related snippets

Google Maps - Get Directions on Mobile Devices with Javascript

/ Published in: JavaScript

Uses html5 geolocation to determine device position and sets this as the starting point for directions on a Google Map. Use modernizer to detect support.\r\n\r\nhttp://diveintohtml5.org/geolocation.html\r\n\r\nhttp://code.google.com/apis/maps/documentation/javascript/services.html#RenderingDirections\r\n\r\nhttp://www.modernizr.com/

Highlighted TextExpand

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;" />	
	
	<title>Demo</title>
	
	<script type="text/javascript" src="_assets/js/plugins/modernizr-1.5.min.js"></script>
	<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>

var start = starthere
		var end = endhere
		var request = {
			origin:start, 
			destination:end,
			travelMode: google.maps.DirectionsTravelMode.DRIVING
		};

directionsService.route(request, function(response, status) {
			if (status == google.maps.DirectionsStatus.OK) {
				directionsDisplay.setDirections(response);
			}
		});
	}
	
</script>
		
	</head>
	
	<body onload="getLocation()">
		<div id="map_canvas"></div>
	</body>
</html>

Report this snippet Tweet