Condition : Utilisateur se trouvant dans une zone précise

Fermé
Heinerammsteiner Messages postés 5 Date d'inscription jeudi 24 mars 2016 Statut Membre Dernière intervention 5 août 2016 - 24 mars 2016 à 09:22
choukie12 Messages postés 55 Date d'inscription vendredi 11 mars 2016 Statut Membre Dernière intervention 27 juin 2018 - 29 mars 2016 à 12:07
Bonjour à vous !

Voilà, je me sers actuellement des API google maps pour un projet. Grossièrement, il y a une map où l'utilisateur se situe. Le principe est que j'ai quelques points d'intérêts, symbolisés part des markers. Je désire ensuite ouvrir une infowindow quand l'utilisateur rentre dans une zone autour du dit point d'intérêt.

Du coup j'ai programmé un petit truc qui me permet de savoir ça :

for (var i = 0, I = result.length ; i < I; i++) {
	var x1 = result[z][4] + 0.005000;
	var x2 = result[z][4] - 0.005000;
    var y1 = result[z][5] + 0.005000;
	var y2 = result[z][5] - 0.005000;
	
	if(latuti > x1 && latuti < x2)
	{
			if(longuti > y1 && longuti < y2)
			{
			alert("Salut");
			}
	}
	}; 


J'explique rapidement le code :

Je calcule les valeurs qui me permettent de savoir si l'utilisateur se trouve dans la zone (pour cela je prend les données du point d'intérêt concerné, puis j'ajoute et enlève un certain nombre de points à sa longitude / latitude pour former deux points précis).
Ensuite je fais une condition qui me permet de savoir s'il est bien dans la zone, et pour le moment je décide de faire apparaître une alerte si c'est bon.

Or... Rien ne s'affiche. Pourtant j'ai bien mis un des points juste à côté d'où je suis, pour tester.. Mais rien. ça vient donc surement de la condition..

Si quelqu'un peut m'aider !

Merci d'avance !

2 réponses

choukie12 Messages postés 55 Date d'inscription vendredi 11 mars 2016 Statut Membre Dernière intervention 27 juin 2018 6
24 mars 2016 à 10:35
Hello,

Tu es sûr que ton result n'est pas vide?

Remonte ton alert dans chaque condition afin de savoir si au moins tu rentres dans les conditions.

Jérémy.
0
Heinerammsteiner Messages postés 5 Date d'inscription jeudi 24 mars 2016 Statut Membre Dernière intervention 5 août 2016
Modifié par Heinerammsteiner le 24/03/2016 à 10:45
Merci de ton aide

Bon j'viens juste de me rendre compte que mon Result était en effet vide pour le coup... Oublié de changer le z :'D Du coup nouveau code :

for (var i = 0, I = result.length ; i < I; i++) {
  
 var x1 = result[i][4] + 0.005000;
 var x2 = result[i][4] - 0.005000;
    var y1 = result[i][5] + 0.005000;
 var y2 = result[i][5] - 0.005000;

 if(latuti < x1 && latuti > x2)
 {
  alert("Salut ça ça marche");
   if(longuti < y1 && longuti > y2)
   {
   alert("Salut");
   }
 }
 }; 


Les Result ne sont pas vides et j'ai rajouté un alert... Et toujours rien =/
0
choukie12 Messages postés 55 Date d'inscription vendredi 11 mars 2016 Statut Membre Dernière intervention 27 juin 2018 6
24 mars 2016 à 10:59
Hello,

De même... avant le
if(latuti < x1 && latuti > x2)

Fait un
alert("coucou je suis la") et un avec les différentes valeures 1, x2,y1,y2 et latuti.


le code me semble bon. Après c'est plus une question de valorisation de variable je pense.
0
Heinerammsteiner Messages postés 5 Date d'inscription jeudi 24 mars 2016 Statut Membre Dernière intervention 5 août 2016 > choukie12 Messages postés 55 Date d'inscription vendredi 11 mars 2016 Statut Membre Dernière intervention 27 juin 2018
Modifié par Heinerammsteiner le 24/03/2016 à 11:07
Eh bien ces alert là marchent. Enfin, les alert s'affichent et montrent bien que les result ne sont pas vides...
0
choukie12 Messages postés 55 Date d'inscription vendredi 11 mars 2016 Statut Membre Dernière intervention 27 juin 2018 6
Modifié par choukie12 le 24/03/2016 à 11:16
Tu peux poster le resultat?

Est ce que tu vois que x2 < latuti < x1 ?
Car je pense que c'est ca le soucis juste, car ton code me semble bon.
0
Heinerammsteiner Messages postés 5 Date d'inscription jeudi 24 mars 2016 Statut Membre Dernière intervention 5 août 2016 > choukie12 Messages postés 55 Date d'inscription vendredi 11 mars 2016 Statut Membre Dernière intervention 27 juin 2018
25 mars 2016 à 14:43
Salut et désolé du retard

Il semblerait que le problème ne vienne pas du result mais du latuti... Malgré mon code, il semblerait que latuti soit vide...

Voilà le code complet :

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>45° imagery</title>
    <style>
html { height: 100% }
body { height: 100%; margin: 0px; padding: 0px }
#map { width: 100%; height: 100% }
    </style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
  </head>
  <body onload="initialize()">
<?php 
// Génération du tableau SQL

	 global $mark;
	 // On ouvre le lien vers le SQL
$mysqli = new mysqli("localhost", "root", "", "points_interet");

// On prend les données
$result = $mysqli->query("SELECT * FROM points_interet");

//on fout tout ça dans la table
While ($row = @mysqli_fetch_assoc($result)){
	$Titre=$row['Titre'];
	$Descriptif=$row['Descriptif'];
	$Adresse=$row['Adresse'];
	$Latitude=$row['Latitude'];
	$Longitude=$row['Longitude'];
	$Lien=urlencode($row['Lien']);
	$mark.="['$Titre','$Descriptif','$Adresse','$Lien',$Latitude,$Longitude],";
}
$mark=substr($mark,0,strlen($mark)-1);
//echo $mark; ?>

    <div id="map">
       <script language="javascript">
	   if (navigator.geolocation)
{
 
}
	/* Génération de la map */
      function initialize() {
   map = new google.maps.Map(document.getElementById("map"), {
        zoom: 19,
        center: new google.maps.LatLng(43.392233, 4.808708),
        mapTypeId: google.maps.MapTypeId.SATELLITE
      });   
		
		/* Vérification position */
		


		if (navigator.geolocation)
  var watchId = navigator.geolocation.watchPosition(successCallback,
                            null,
                            {enableHighAccuracy:true});
else
  alert("Votre navigateur ne prend pas en compte la géolocalisation HTML5");    
 
function successCallback(position){
	var latuti = position.coords.latitude;
	var longuti = position.coords.longitude;
  map.panTo(new google.maps.LatLng(position.coords.latitude, position.coords.longitude));
  var marker = new google.maps.Marker({
    position: new google.maps.LatLng(position.coords.latitude, position.coords.longitude), 
    map: map
  }); 
  
}

				/* Génération du marker */		
				
				// Les données - Génération du Tableau
	var result = [<?php echo $mark ?>];
				
	var array1 = ['Titre:test','descr : descriptif',43.392350,4.807796];
	var array2 = ['Titre:test','descr : descriptif',43.392044,4.809710];
	var array3 = ['Titre:test','descr : descriptif',43.392853,4.808811];
	var array4 = ['Titre:test','descr : descriptif',43.4413716,4.789873099999999];
	var arrayt = [array1,array2,array3,array4];
	
				// générateur markers
	
	for (var i = 0; i < result.length; i++) {
     var marker = new google.maps.Marker({
          position:  {lat:result[i][4], lng:result[i][5]},
          map: map,
          title: result[i][0],
        });
	};
	
	
	// vérification
	for (var i = 0; i <= result.length; i++) {
  if (navigator.geolocation)
    var watchId = navigator.geolocation.watchPosition(successCallback, errorCallback, {enableHighAccuracy:true});
else
    alert("Votre navigateur ne prend pas en compte la géolocalisation HTML5");
    
function successCallback(position){
	var latuti = position.coords.latitude;
	var longuti = position.coords.longitude;
    alert("Latitude : " + latuti + ", longitude : " + longuti);
};  

function errorCallback(error){
    switch(error.code){
        case error.PERMISSION_DENIED:
            alert("L'utilisateur n'a pas autorisé l'accès à sa position");
            break;          
        case error.POSITION_UNAVAILABLE:
            alert("L'emplacement de l'utilisateur n'a pas pu être déterminé");
            break;
        case error.TIMEOUT:
            alert("Le service n'a pas répondu à temps");
            break;
        }
};

function stopWatch(){
    navigator.geolocation.clearWatch(watchId);
}   
	var x1 = result[i][4] + 0.005000;

	var x2 = result[i][4] - 0.005000;
	alert(latuti);
    var y1 = result[i][5] + 0.005000;
	alert(y1);
	var y2 = result[i][5] - 0.005000;
	alert(y2);
	
	if(latuti < x1 && latuti > x2)
	{
		alert("Salut ça ça marche");
			if(longuti < y1 && longuti > y2)
			{
			alert("Salut");
			}
	}
	}; 
	  }
	</script>

    <script async defer
    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBb3EJzCf0lgSTdgdZyIaMPb3VraV303TI&callback=initMap">
    </script>
	</div>
  </body>
</html>


Pour le coup je sèche. =/
0
choukie12 Messages postés 55 Date d'inscription vendredi 11 mars 2016 Statut Membre Dernière intervention 27 juin 2018 6 > Heinerammsteiner Messages postés 5 Date d'inscription jeudi 24 mars 2016 Statut Membre Dernière intervention 5 août 2016
29 mars 2016 à 12:07
Hello,

En fait, jamais tu passes ta variable position à la méthode successCallback qui elle attend une variable. Du coup le soucis vient peut être de la...

var watchId = navigator.geolocation.watchPosition(successCallback, errorCallback, {enableHighAccuracy:true});


Juste avant tu initialise ta variable position mais tu ne la donnes jamais à la méthode.

Sinon tu peux zieuter ici : https://developer.mozilla.org/fr/docs/Web/API/Geolocation_API

Jérémy.
0