Caricare più google maps con un ciclo

  • Creatore Discussione Creatore Discussione Maures
  • Data di inizio Data di inizio

Maures

Utente Attivo
25 Mar 2015
45
0
0
Buongiorno a tutti,
tramite una query sql ho recuperato alcune coppie di coordinate che dovrei mostrare in una o più mappe.

l'ideale sarebbe mostrarle tutte con dei marker in una mappa, ma non so come fare perché non conosco a priori quante righe estrarrò dal database.
esiste comunque un modo per rendere lo script della mappa "dinamico"?

l'alternativa meno ottimizzata, ma forse più semplice da raggiungere è quella di mostrare una mappa per ogni coppia. il problema è che, inserendo tutto in un ciclo in php, mi mostra solo la prima mappa e non le altre.

qui c'è una porzione del codice.

lo script per generare una mappa
Codice:
<style>
      html, body, #map-canvas {
        height: 90%;
		margin-top: 30px;
      }
    </style>
	
	<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
    
	<script>
	function mappa() {

	var coords = document.getElementById('coords').innerHTML.split(",");
        var lat = coords[0];
        var lon = coords[1];
	
	var myCoord1 = new google.maps.LatLng(lat,lon);
	
	var mapOptions = {
		zoom: 14,
		center: myCoord1
	};

	var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
	
	var marker1 = new google.maps.Marker({
			  position: myCoord1,
			  map: map
		  });
	
	}

	google.maps.event.addDomListener(window, 'load', mappa);
	
    </script>

questa invece è la porzione di codice su cui lo script javascript si basa (uso un fetch di prepared statement per i risultati della query, la funzione mappa() di qui sopra recupera la coppia di coordinate dalla stringa nascosta del tag p qui sotto

Codice:
while ($stmt->fetch()) {
	echo "<div class='container' id='map-canvas' style='border:1px solid black; margin-bottom:20px'>
	         <p hidden='hidden' id='coords'>$lat,$lon</p>
		</div>"; 
}

ogni consiglio è ben accetto.
 
mi rispondo da solo, così che se qualcun altro avesse il mio stesso problema, potrà risolverlo!

dopo aver sbattuto la testa su varie prove, ho trovato questo codice che era proprio ciò che cercavo: un ciclo for php all'interno di uno script javascript.

Preciso e anche abbastanza pulito, funziona bene anche nel caso di molti marker.
 

Discussioni simili