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
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
ogni consiglio è ben accetto.
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.