1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55
| <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false?key=<?php echo $apikey; ?>"></script>
<script type="text/javascript">
/* Déclaration du centre de la map */
var latlng = new google.maps.LatLng(<?php echo $mapcenter; ?>); // initialize view
/* Déclaration de l'objet qui définira les limites de la map */
var bounds = new google.maps.LatLngBounds();
/* Déclaration et remplissage du tableau qui contiendra nos points, objets LatLng. */
var myPoints = [];
<?php
//Recuperation de point de ma bdd
foreach ($itemsLoc as $itemLoc){
$coord = unserialize ($itemLoc->value);
$lat = $coord['lat'];
$lon = $coord['lon'];
$coord = $lat.",".$lon;
echo "myPoints.push( new google.maps.LatLng(". $coord .")); \r\n";
}
?>
/* Déclaration des options de la map */
var options = {
/*zoom : 7,
center: latlng, */
// ici, ces 2 valeurs ne sont plus utiles car calculées automatiquement
mapTypeId: google.maps.MapTypeId.<?php echo $maptype; ?>
}
/* Ici, nous déclarons l'élément html ayant pour id "map" comme conteneur de la map */
var myDiv = document.getElementById('map');
/* Chargement de la carte avec un type ROADMAP */
var map = new google.maps.Map(myDiv,options);
/* Boucle sur les points afin d'ajouter les markers à la map
et aussi d'étendre ses limites (bounds) grâce à la méthode extend */
for(var i = 0; i < myPoints.length; i++){
bounds.extend(myPoints[i]);
var thisMarker = addThisMarker(myPoints[i],i);
thisMarker.setMap(map);
}
/* Ici, on ajuste le zoom de la map en fonction des limites */
map.fitBounds(bounds);
/* Fonction qui affiche un marker sur la carte */
function addThisMarker(point,m){
var marker = new google.maps.Marker({position: point});
/*TODO ADD CLUSTER PINT SYSTEM*/
return marker;
}
</script> |
Partager