ecco cosa ho usato:

<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 JavaScript API v3 Example: Directions Simple</title>
<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="//maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var directionDisplay;
var directionsService = new google.maps.DirectionsService();
var map;

function initialize() {
directionsDisplay = new google.maps.DirectionsRenderer();
var chicago = new google.maps.LatLng(37.50505959242114, 15.0897216796875);
var myOptions = {
zoom:15,
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: chicago
}
map = new google.maps.Map(document.getElementById("map_canva s"), myOptions);
directionsDisplay.setMap(map);
}

function calcRoute() {
var start = document.getElementById("start").value;
var end = document.getElementById("end").value;
var request = {
origin:start,
destination:end,
travelMode: google.maps.DirectionsTravelMode.DRIVING,
unitSystem: google.maps.UnitSystem.METRIC
};
directionsService.route(request, function(response, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(response);
document.getElementById("distanza").innerHTML = response.routes[0].legs[0].distance.text;
}
});
}
</script>
</head>
<body onload="initialize()">
<div>
Start:
<select id="start" onchange="calcRoute();">
<option value="">--- scegli ---</option>
<option value="Taormina">Taormina</option>
<option value="Palermo">Palermo</option>
<option value="Catania">Catania</option>
<option value="Giarre">Giarre</option>
</select>
End:
<select id="end" onchange="calcRoute();">
<option value="">--- scegli ---</option>
<option value="Siracusa">Siracusa</option>
<option value="Messina">Messina</option>
</select>
</div>
<div id="distanza" style="position:absolute;top:30px;left:0px;height: 30px;width:100px;background-color:#CCCCCC"></div>
</body>
</html>

Funziona...

Adesso ti faccio due domande:

1) Se piuttosto che il nome della città, nella value della select volessi usare le coordinate (lat e Lang), come dovrei fare?

2) Estraggo dal database N località. Vorrei che per ognuna di esse mi restituisca la distanza dal punto principale (per intenderci quello della variabile "var chicago"), ordinata per distanza dalla più vicina alla più lontana. Es

distanza da ---------> a
var chicago primo indirizzo (Lat e Lang) = 3,5 km
var chicago secondo indirizzo (Lat e Lang) = 5,6 km
var chicago terzo indirizzo (Lat e Lang) = 12,5 km
ecc...

Qualcosa del tipo uso l'ASP:

<% for i=1 to n %>
Qui una riga che recuperi i valori di latitudine e longitudine e li passi ad una funzione che restituisca il valore
<%
rs.movenext
loop
%>

per intenderci, una cosa del genere:
http://www.ariadelsalento.it/index.p...=79&Itemid=103