JavaScript — как обновить маркер карты Google с изменением в базе данных
Я работаю по отслеживанию транспортного средства. Я пытаюсь обновить маркер карты при внесении изменений в базу данных. Я делаю следующий код, который показывает маркер, но мне нужно его обновить при изменении значения местоположения в базе данных MYSQL
Мой код здесь
<?php
include('connect.php');
if(!isset($_POST['bus_select'])){
header('Location: index.php');
exit;
}
?>
<!DOCTYPE html>
<html>
<head>
<title>JU Bus Google Map</title>
<style type="text/css">
html {height:100%}
body {height:100%;margin:0;padding:0}
#googleMap {height:100%}
</style>
<script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyCzr1ZAuglRaD5BQA2u03fWftMB7RkOzxE&sensor=false"></script>
<?php
//for important date page
function value_return($query){
$result= mysql_query($query);
$value=mysql_result($result,0);
return $value;
}$lat= value_return('SELECT `lat` FROM `bus` WHERE `bus_id`='.$_POST['bus_select']);
$long= value_return('SELECT `long` FROM `bus` WHERE `bus_id`='.$_POST['bus_select']);
$detail= value_return('SELECT `bus_details` FROM `bus` WHERE `bus_id`='.$_POST['bus_select']);
$last_updated= value_return('SELECT `last_update` FROM `bus` WHERE `bus_id`='.$_POST['bus_select']);
print '
<script>
var myCenter=new google.maps.LatLng('.$lat.','.$long.');
var marker;
function initialize()
{
var mapProp = {
center:myCenter,
zoom:15,
mapTypeId:google.maps.MapTypeId.ROADMAP
};
var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);
marker=new google.maps.Marker({
position:myCenter,
animation:google.maps.Animation.BOUNCE
});
marker.setMap(map);
var infowindow = new google.maps.InfoWindow({
content:"'.$detail.'<br>Last Updated: '.$last_updated.'"});
infowindow.open(map,marker);}
google.maps.event.addDomListener(window, "load", initialize);
</script>';
?>
</head>
<body>
<div id="googleMap" ></div>
</body>
</html>
Решение
Вам нужно запросить базу данных — обычно это делается с помощью AJAX … вот учебник пример.
После этого вы просто вызываете marker.setPosition (YOUR-NEW-LATLNG)
Другие решения
Других решений пока нет …