Script per calcolo percorso e itinerario google, piccolo problema

[marcopaolo79]

Salve a tutti ho preso spunto da diversi script che si trovano in giro per realizzare uno script che tramite le api di google genera una mappa di google con la cartina con il percorso e con le indicazioni da seguire.
Tutto funziona alla perfezione ho solo un piccolo problema ovvero, se io faccio la prima ricerca la mia mappa indica correttamente il percorso e le indicazioni stradali (testuali) sono corrette se poi voglio eseguire una seconda ricerca la mappa è corretta mentre le indicazioni stradali rimangono le stesse come se non si aggiornassero.
Ecco il mio script:

<script type="text/javascript">
var directionDisplay;
var directionsService = new google.maps.DirectionsService();
var map;

function initialize() {
  
	var latlng = new google.maps.LatLng(43.0907,11.6489);
	var myoptions2 = {
  		zoom: 14,
  		center: latlng,
  		mapTypeId: google.maps.MapTypeId.ROADMAP
	};

	map = new google.maps.Map(document.getElementById('map'), myoptions2);
	
	var marker = new google.maps.Marker(
		{
  			position: latlng,
  			map: map,
  			icon: '/images/come_arrivare/fonte-bertusi.png',
			flat: true
		}
	);
	
	var tooltip = '<div id="tooltip">'+
				'[img]/images/home/casale.jpg[/img]'+
   				'

Fonte Bertusi
'+
				'Podere Fonte Bertusi di Sotto
'+
				'53026 Pienza (Siena)
'+
    			'Toscana - Italia
'+
				'Tel. (+39) 0578 748077</p>'+
    			'</div>';
					
	var infowindow = new google.maps.InfoWindow({
		content: tooltip
	});
		
	google.maps.event.addListener(marker, 'click', function() {
  				infowindow.open(map,marker);
			});


	
	document.getElementById("submit").onclick = function() {
		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);
		directionsDisplay.setPanel(document.getElementById("panel"));
	}
	
}
  
  function calcRoute() {
    var partenza = document.getElementById("partenza").value;
    var arrivo = new google.maps.LatLng(43.0906,11.6489);
    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>

ed ecco la parte di html dove lo uso:

<div id="map"></div>

<div>



Città di partenza: 
<input type="text" id="partenza" value="">
<input id="submit" type="button" value="Calcola il percorso">
</div>

<div id="panel"></div>

dove sbaglio?? potete aiutarmi??

se volete fare una prova direttamente voi vi dò il link:
http://www.fontebertusi.it/ita/come-...-siena-new.asp

provate a calcolare prima da milano e poi da roma
vedete la cartina è sempre corretta ma le indicazioni rimangono sempre quelle di milano (prima ricerca)

grazie a tutti per l'aiuto

[Vindav]

se poi voglio eseguire una seconda ricerca la mappa è corretta mentre le indicazioni stradali rimangono le stesse come se non si aggiornassero.

A dire la verità ci sono anche le seconde indicazioni, vengono posizionale sotto le prime, probabilmente non te ne sei accorto

[marcopaolo79]

... hai ragione non me ne ero assolutamente accorto !!!!

cmq il problema rimane...... perchè non me le sovrascrive?!

dovrebbe cancellare le vecchie indicazioni e far vedere le nuove!

[Vindav]

svuota il contenitore prima di presentare le nuove indicazioni.

[marcopaolo79]

Un'idea di come fare?

[Vindav]

...
document.getElementById("panel").innerHTML = "";
directionsDisplay.setPanel(document.getElementById("panel"));
...

[marcopaolo79]

Infatti è lo stesso codice che avevo scritto e pensavo di metterlo all'inizio della funzione onclick

ovvero:

document.getElementById("submit").onclick = function() {
document.getElementById("panel").innerHTML = "";
directionsDisplay.setPanel(document.getElementById("panel"));
		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);
		directionsDisplay.setPanel(document.getElementById("panel"));
	}

ma non funziona nulla così e nemmeno se la metto dentro la function calcroute() all'inizio...

grazie ancora, scusami ma di javascript come hai visto non sono ferratissimo...

[marcopaolo79]

Capito da solo.... che duro!!!

grazie di tutto!!!

[Vindav]

edit: perfetto, di nulla