is there anyone can help please ? :)
1) First I get the user coords with geoloc function 2) I compare these coords to database shops to find the nearest and get shop coords 3) I want to show the Google Map with the pin in the middle
But I get too much recursion
error, and wonder how to set ajax return because if I directly add positionmagasin = new google.maps.LatLng(45.764043,4.835659);
instead of positionmagasin = new google.maps.LatLng(coordonnees);
it works well...
Thank you for your answer !
Here my html and Script :
<!-- Un élément HTML pour recueillir l’affichage -->
<div id="infoposition"></div>
<div id="map"></div>
<script type="text/javascript">
// Récupère tous les coordonnées des magasins
function getMarkers(map) {
var magasins = new Array;
<?php
$querymag = mysql_query("SELECT * FROM magasins");
$nbmag = mysql_num_rows($querymag);
if($nbmag > 0){
while($rowmag = mysql_fetch_array($querymag)){
$mag_id = $rowmag['id_magasins'];
$mag_titre = $rowmag['titre_magasins'];
$mag_lat = $rowmag['lat_magasins'];
$mag_lng = $rowmag['lng_magasins'];
?>
var intermediaire = new Array('<?php echo $mag_id;?>','<?php echo $mag_titre;?>','<?php echo $mag_lat;?>','<?php echo $mag_lng;?>');
magasins.push(intermediaire);
<?php
}
}
?>
setMarkers(map, magasins);
}
// Place les markers sur la carte
function setMarkers(map, locations) {
for (var i = 0; i < locations.length; i++) {
var magasins = locations[i];
//console.log(magasins);
var myLatLng = new google.maps.LatLng(magasins[2], magasins[3]);
var infoWindow = new google.maps.InfoWindow();
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
animation: google.maps.Animation.DROP,
});
(function(i) {
google.maps.event.addListener(marker, "click", function() {
var magasins = locations[i];
infoWindow.close();
infoWindow.setContent(
"<div id='boxcontent' style='font-family:Calibri'><strong style='color:green'>"
+ magasins[1] +
"</strong><br /><span style='font-size:12px;color:#333'>Ceci est un test.</span></div>"
);
infoWindow.open(map, this);
});
})(i);
}
}
function maPosition(position) {
// Récupère les coordonnées de l'utilisateur
var x = position.coords.latitude;
var y = position.coords.longitude;
// Lance la fonction de calcul SQL pour trouver les coordonnées du magasin le + proche
var request = $.ajax({
url: 'fichier2.php',
type: 'GET',
data: {
action: 'position',
lat: x,
lng: y
}
});
request.done(function(retourAjax){
//donne les coordonnées du magasin en paramètre
document.getElementById("infoposition").innerHTML = retourAjax;
var coordonnees = retourAjax;
//---------------- là ça bloque !!! ------------------ //
positionmagasin = new google.maps.LatLng(coordonnees);
// --------------------------------------------------- //
map = new google.maps.Map(document.getElementById("map"), {
zoom: 7,
center: positionmagasin,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
//centre la carte sur la position du magasin
map.panTo(positionmagasin);
getMarkers(map);
});
request.fail(function(retourAjax) {
defPosition();
});
}
// Affichage de la position par défaut en cas d'erreur
function defPosition() {
var info = "Erreur lors de la géolocalisation : Affichage par défaut";
document.getElementById("infoposition").innerHTML = info;
var latlng = new google.maps.LatLng(48.856614,2.352222);
map = new google.maps.Map(document.getElementById("map"), {
zoom: 7,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
map.panTo(latlng);
getMarkers(map);
}
// Fonction de callback en cas d’erreur
function erreurPosition(error) {
var info = "Erreur lors de la géolocalisation : ";
switch(error.code) {
case error.TIMEOUT:
info += "Timeout !";
break;
case error.PERMISSION_DENIED:
info += "Vous n’avez pas donné la permission // affichage de la position par défaut";
defPosition();
break;
case error.POSITION_UNAVAILABLE:
info += "La position n’a pu être déterminée";
defPosition();
break;
case error.UNKNOWN_ERROR:
info += "Erreur inconnue";
break;
}
document.getElementById("infoposition").innerHTML = info;
}
// Tester si le navigateur est compatible et lancer la géolocalisation
if(navigator.geolocation) {
survId = navigator.geolocation.getCurrentPosition(maPosition,erreurPosition);
} else {
alert("Ce navigateur ne supporte pas la géolocalisation");
}
</script>
The PHP :
<?php
include 'fonction/_connexion.php';
function Findmagasin($lat1, $lng1){
$query = mysql_query("SELECT *, get_distance_metres($lat1, $lng1, lat_magasins, lng_magasins) AS proximite
FROM magasins WHERE get_distance_metres($lat1, $lng1, lat_magasins, lng_magasins) < 1000000 ORDER BY proximite ASC LIMIT 1");
$nb = mysql_num_rows($query);
if($nb = 1){
$row = mysql_fetch_array($query);
$id = $row['id_magasins'];
$titre = $row['titre_magasins'];
$x = $row['lat_magasins'];
$y = $row['lng_magasins'];
// coordonnées du magasin le plus proche
echo $x.",".$y;
} else {
echo "48.856614,2.352222";
}
}
// vérifier si une action à réaliser est transmise
if (isset($_GET['action'])) {
// si oui réalise l'action
$action = $_GET['action'];
switch ($action) {
case 'position':
// verifie qu'un étudiant a bien été transmis
if (isset($_GET['lat']) && isset($_GET['lng'])){
$lat1 = $_GET['lat'];
$lng1 = $_GET['lng'];
Findmagasin($lat1, $lng1);
} else {
echo 'aucun ordre transmis';
}
break;
}
} else {
echo 'aucune action transmise';
} ?>