Salve a tutti...allora praticamente basta inserire un oggetto HTML e inserire questo codice:
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps API v3: Directions</title>
<style type="text/css">
html, body { margin:0; padding:0; width:100%; height:100%; }
body { background:#FFFFFF; color:#000000; font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:150%; text-align:center;}
#map { width:100%; height:95%; }
input { width:250px; }
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var directionDisplay;
var directionsService = new google.maps.DirectionsService();
var map;
function initialize() {
calcRoute();
directionsDisplay = new google.maps.DirectionsRenderer();
var myOptions = {
zoom:7,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map"), myOptions);
directionsDisplay.setMap(map);
document.getElementById("submit").onclick = function() {
calcRoute();
}
}
function calcRoute() {
var partenza = document.getElementById("partenza").value;
var arrivo = document.getElementById("arrivo").value;
var request = {
origin:partenza,
destination:arrivo,
travelMode: google.maps.DirectionsTravelMode.DRIVING
};
directionsService.route(request, function(response, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(response);
}
});
}
window.onload = initialize;
</script>
</head>
<body>
<div>
<strong>Partenza: </strong>
<input type="text" id="partenza" value="AGROPOLI">
<strong>Arrivo: </strong>
<input type="text" id="arrivo" value="PAESTUM">
<input id="submit" type="button" value="Calcola percorso">
<>
<br>
<div id="map"><>
</br>
</body>
</html>
Giustamente dove io ho inserito le località...voi inserite le vostre
Non è nulla di che ma spero che vada bene anche per voi :-)
