Здравствуйте, я очень хорошо отобразил свои маркеры из базы данных на моей карте Google в php с помощью учебника из Google API v3 из этого ссылка на сайт .
Теперь в моем коде я загружаю позицию текущего пользователя, используя позицию наблюдения для динамического обновления позиции маркера.
Также он отправляет в мою базу данных mysql каждые 5 секунд координаты геолокации HTML5. Но как динамически обновлять каждые 30 секунд положение маркеров на карте, не обновляя страницу в моем случае?
Вот мой код (голова):
<script type="text/javascript">//<![CDATA[
var customIcons = {
restaurant: {
icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png'
},
bar: {
icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png'
}
};
setInterval(function load() {
var infoWindow = new google.maps.InfoWindow;// Change this depending on the name of your PHP file
downloadUrl("phpsqlajax_genxml.php", function(data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
var name = markers[i].getAttribute("name");
var id = markers[i].getAttribute("address");
var address = markers[i].getAttribute("address");
var type = markers[i].getAttribute("type");
var point = new google.maps.LatLng(
parseFloat(markers[i].getAttribute("lat")),
parseFloat(markers[i].getAttribute("lng")));
var chaine = markers[i].getAttribute("address");
var reg=new RegExp("[ ,]+", "g");
var mot= chaine.split(reg);
// add each marker's location to the bounds
bounds.extend(point);
var html = " Dernier statut : " + name + " <br><a href=profil.php?id="+ mot[0] +">Cliquez-ici pour voir le profil de "+ mot[1] +"<a> <br><img with=28 src=images/message.png><a href=# alt="+ mot[0] +"|"+ mot[1] +" class=chat_user>Clavarder</a> ";
var icon = type;
var avatar = new google.maps.MarkerImage(icon,
new google.maps.Size(71, 71),
new google.maps.Point(0, 0),
new google.maps.Point(17, 34),
new google.maps.Size(50, 50)
);var pictureLabel = document.createElement("img");
pictureLabel.src = type;var marker = new MarkerWithLabel({position: point,
draggable: false,
raiseOnDrag: false,
labelInBackground: false,
map: map,
labelContent: pictureLabel,
labelAnchor: new google.maps.Point(32, 84),
labelClass: "labels", // the CSS class for the label
labelStyle: {opacity: 1}});
markersArray.push(marker);
bindInfoWindow(marker, map, infoWindow, html);
// center and zoom the map to fit the bounds
}
// center and zoom the map to fit the bounds
map.fitBounds(bounds);
});}, 3000);
function bindInfoWindow(marker, map, infoWindow, html) {
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(html);
infoWindow.open(map, marker);
});}
function downloadUrl(url, callback) {
var request = window.ActiveXObject ?
new ActiveXObject('Microsoft.XMLHTTP') :
new XMLHttpRequest;
request.onreadystatechange = function() {
if (request.readyState == 4) {
request.onreadystatechange = doNothing;
callback(request, request.status);
}
};
request.open('GET', url, true);
request.send(null);
}function doNothing() {}
//]]></script>
<?php
} ?>
<script>
$(function() {
var pull = $('#pull');
menu = $('nav ul');
menuHeight = menu.height();
$(pull).on('click', function(e) {
e.preventDefault();
menu.slideToggle();
});
$(window).resize(function(){
var w = $(window).width();
if(w > 320 && menu.is(':hidden')) {
menu.removeAttr('style');
}
});
});
setInterval(ajaxCall, 1000); //300000 MS == 5 minutes
function ajaxCall() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function (position) {
$.ajax({
type: "POST",
url: "index.php",
data: {
x: position.coords.latitude,
y: position.coords.longitude
},
});
});
}
}
</script>
И php, который обновляет базу данных:
<div id="requete">
<?php
if (!isset($_SESSION['email'])) {
} else {if (!isset($_POST['x']) AND !isset($_POST['y'])) {
} else {
$base = mysql_connect ('localhost', '', '');
mysql_select_db ('', $base);// lancement de la requête
$sql ='UPDATE membre SET lat="'.$_POST['x'].'", lon="'.$_POST['y'].'" WHERE email="'.$_SESSION['email'].'"';// on exécute la requête (mysql_query) et on affiche un message au cas où la requête ne se passait pas bien (or die)
mysql_query($sql) or die('Erreur SQL !'.$sql.'<br />'.mysql_error());
// on ferme la connexion à la base
mysql_close();
}
}
?></div>
огромное спасибо
Задача ещё не решена.
Других решений пока нет …