Visualizzazione dei risultati da 1 a 3 su 3
  1. #1

    2 mappe google maps con percorso nella stessa pagina ma in 2 div diversi

    Salve a tutti, ho provato a cercare altri topic simili ma ne ho trovato solo 1 che include però mappe fisse senza calcolo del percorso con partenza variabile quindi la soluzione non si adatta alle mie esigenze.
    In pratica devo inserire 2 mappe con calcolo del percorso con partenza variabile in 2 div diversi nella stessa pagina.
    qui sotto ho postato il codice da me utilizzato finora
    il problema della mappa1 è che se gli faccio calcolare il percorso me lo inserisce in directions2 di mappa 2

    i problemi di mappa2 sono:
    1)la mappa2 che si vede al caricamento è identica a mappa1, ma appena gli faccio calcolare il percorso si corregge

    2)se imposto in mappa 1 un indirizzo di partenza, viene automaticamente assegnato anche a mappa 2

    Vi sarò infinitamente grato se riuscirete a dipanare questo dubbio, ho cambiato un bel po di variabili ma senza esito positivo!

    Grazie


    codice:
    <body onload="initialize();initialize2()" onunload="GUnload()">
    
    <div> 
    		<h3>Titolo Mappa1</h3>
    
    
    
    <script type="text/javascript">
     var map;
        var gdir;
        var geocoder = null;
        var addressMarker;
    
        function initialize() {
          
    	  if (GBrowserIsCompatible()) {
    		map = new GMap2(document.getElementById("map_canvas"));
    		map.addControl(new GSmallMapControl());
    		map.addControl(new GMapTypeControl());
    		map.setCenter(new GLatLng(45.476744,9.20738), 13);
    		
    		var marker = new GMarker(new GLatLng(45.476744,9.20738))
    		map.addOverlay(marker);
    		marker.openInfoWindowHtml("Chiesa di Santa Prisca
    Via di Santa Prisca, 11
    00153 Roma");
    		
    		gdir = new GDirections(map, document.getElementById("directions"));
    		GEvent.addListener(gdir, "error", handleErrors);
    	  }
        }
        
        function setDirections(fromAddress) {
    	  locale="it";
          gdir.load("from: " + fromAddress + " to: Via di Santa Prisca, 11, 00153 Roma");
        }
    
        function handleErrors(){
    	   if (gdir.getStatus().code == G_GEO_UNKNOWN_ADDRESS)
    	     alert("Indirizzo non trovato");
    	   else if (gdir.getStatus().code == G_GEO_SERVER_ERROR)
    	     alert("Si è verificato un errore nella geocodifica degli indirizzi");
    	   
    	   else if (gdir.getStatus().code == G_GEO_MISSING_QUERY)
    	     alert("Manca un parametro");
    	     
    	   else if (gdir.getStatus().code == G_GEO_BAD_KEY)
    	     alert("Errore nella Key Api.");
    
    	   else if (gdir.getStatus().code == G_GEO_BAD_REQUEST)
    	     alert("La richiesta non puo' essere correttamente risolta.");
    	    
    	   else alert("Si è verificato un errore");
    	   
    	}
    </script>
    
    
    <div id="map_canvas" style="width: 580px; height: 400px"></div>
    <div id="location">
    	<form action="#" onsubmit="setDirections(this.partenza.value); return false">
    		Esempio: "Viale Marconi 100, roma"
    
    		parti da:<input type="text" name="partenza"/><input type="submit" value="Calcola"/><input type='button' value='Stampa' onclick='Stampa()'/>
    	</form>
    </div>
    
    <div id="directions" style="width: 580px; height:340px; overflow:auto"></div>
    
    	</div>
    	<div> 
    		<h3>Titolo mappa2</h3>
    		<script type="text/javascript">
     var map2;
        var gdir;
        var geocoder = null;
        var addressMarker;
    
        function initialize2() {
          
    	  if (GBrowserIsCompatible()) {
    		map2 = new GMap2(document.getElementById("map_canvas2"));
    		map2.addControl(new GSmallMapControl());
    		map2.addControl(new GMapTypeControl());
    		map2.setCenter(new GLatLng(45.476744,9.20738), 13);
    		
    		var marker = new GMarker(new GLatLng(45.476744,9.20738))
    		map2.addOverlay(marker);
    		marker.openInfoWindowHtml("Villa Piccolomini
    Via Aurelia, 164
    00165 Roma");
    		
    		gdir = new GDirections(map2, document.getElementById("directions2"));
    		GEvent.addListener(gdir, "error", handleErrors);
    	  }
        }
        
        function setDirections(fromAddress) {
    	  locale="it";
          gdir.load("from: " + fromAddress + " to: Via Aurelia, 164, 00165 Roma");
        }
    
        function handleErrors(){
    	   if (gdir.getStatus().code == G_GEO_UNKNOWN_ADDRESS)
    	     alert("Indirizzo non trovato");
    	   else if (gdir.getStatus().code == G_GEO_SERVER_ERROR)
    	     alert("Si è verificato un errore nella geocodifica degli indirizzi");
    	   
    	   else if (gdir.getStatus().code == G_GEO_MISSING_QUERY)
    	     alert("Manca un parametro");
    	     
    	   else if (gdir.getStatus().code == G_GEO_BAD_KEY)
    	     alert("Errore nella Key Api.");
    
    	   else if (gdir.getStatus().code == G_GEO_BAD_REQUEST)
    	     alert("La richiesta non puo' essere correttamente risolta.");
    	    
    	   else alert("Si è verificato un errore");
    	   
    	}
    </script>
    
    
    <div id="map_canvas2" style="width: 580px; height: 400px"></div>
    <div id="location">
    	<form action="#" onsubmit="setDirections(this.partenza2.value); return false">
    		Esempio: "Viale Marconi 100, roma"
    
    		parti da:<input type="text" name="partenza2" value="Via di Santa Prisca, 11, 00153 Roma"/><input type="submit" value="Calcola"/><input type='button' value='Stampa' onclick='Stampa()'/>
    	</form>
    </div>
    
    <div id="directions2" style="width: 580px; height:340px; overflow:auto"></div>
    
    	</div>
    </body>

  2. #2
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    Prova a leggere qui, ma ho qualche dubbio che si possa fare su due div separati
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  3. #3
    Utente di HTML.it
    Registrato dal
    Dec 2010
    Messaggi
    3,660
    almeno cambia il nome delle funzioni, come puoi sperare che vada se dai gli stessi nomi alle funzioni della mappa 1 e 2? Inoltre ti sconsiglio vivamente di duplicare il codice, forse risulta piu semplice per te ma è un vero e proprio spreco, basta creare un unica funzione che gestistca entrambe le mappe passando in input l'oggetto o l'id della mappa su cui si deve operare.

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.