déclencher la demande de fonction php lorsque google maps est déplacé

Question

Quand un marqueur est placé, je veux appeler une fonction php (dans un autre fichier) avec la latitude et la longitude en entrée et afficher le résultat dans un div de la page. Ainsi, chaque fois que le marqueur est déplacé, il met à jour la div avec le dernier résultat de la fonction.

Je sais que javascript est nécessaire, mais je ne le connais pas très bien et toute aide serait la bienvenue.

Answer 1

Voici un exemple d'utilisation de jQuery pour déclencher un HTTP GET lorsqu'un marqueur est ajouté à la carte et chaque fois qu'il est déplacé. Le résultat de la requête est placé dans un div portant l'id "outputdiv".

// create and init map (make sure to have a div element with id "map")
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(37.4419, -122.1419), 13);

// this is the marker you want to track
var marker = new GMarker(new GLatLng(37.4419, -122.1419));
map.addOverlay(marker);

// create function to be executed on add/end of drag
var changeCallback = function(latlng) {
  // do HTTP GET to execute PHP function in file, with coordinate
  // as parameter and put result in div with id "outputdiv"
  $("#outputdiv").load("test.php?latlng=" + latlng.toUrlValue());
};

// add listener triggered whenever drag of marker has ended
GEvent.addListener(marker, "dragend", changeCallback);

// explicitly call when added
changeCallback(marker.getLatLng());

Mise à jour pour répondre au commentaire: le paramètre latlng de la fonction de rappel est un GLatLng dans lequel vous pouvez utiliser lat () et lng () pour récupérer les valeurs individuelles. Pour plus de détails, voir référence de l'API Google Maps .

Answer 2

Vous devez utiliser du code JavaScript et XML asynchrone (appelé AJAX). Vous trouverez un bon tutoriel sur le sujet ici: http://www.w3schools.com/Ajax/ Default.Asp .

En fait, vous pourrez probablement faire ce que vous avez décrit après avoir parcouru ces exemples.

1. Vous devez d’abord créer l’objet XMLHttpRequest en JavaScript comme suit: http: // www. w3schools.com/Ajax/ajax_browsers.asp
2. Ensuite, découvrez comment définir la méthode onreadystatechange () . / a> - c’est là que vous spécifiez ce qui se passe lorsque le serveur (la fonction que vous souhaitez appeler) répond.
3. Envoyez ensuite la demande à la fonction, que vous devriez pouvoir appeler en interrogeant un fichier php avec une requête GET ou POST comme celle-ci: xmlhttp.open (" GET "," myfunction.php ", true); xmlhttp.send (null) ;

Pour le reste, suivez simplement le tutoriel et tout devrait bien se passer. Vous avez vraiment besoin d'un tutoriel à suivre - javascript est assez facile à copier / coller et à éditer: D