更新標記每X次更新一次

我試圖每隔X次更新一次標記位置，並想知道如何做到這一點，以及是否有很好的示例。
我的代碼是：
更新標記每X次更新一次

<?php 
include 'connect.php'; 
$json= array(); 
$res = "SELECT LatLon,fname FROM customers"; 
$res = mysql_query($res); 
while($r = mysql_fetch_assoc($res)) { 

    $XY = explode(",",$r['LatLon']); 

    $json[]= array($r['fname'],$XY[1],$XY[0]); 

} 

?> 
<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> 
    <title>Google Maps Multiple Markers</title> 
    <link href="https://google-developers.appspot.com/maps/documentation/javascript/examples/default.css" rel="stylesheet"> 
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> 


    <script type="text/javascript"> 

    var map; 

    // Cretes the map 
    function initialize() { 
     map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 5, 
     center: new google.maps.LatLng(-33.92, 151.25), 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
     }); 
    } 

    // This function takes an array argument containing a list of marker data 
    function generateMarkers(locations) { 

     for (var i = 0; i < locations.length; i++) { 

     new google.maps.Marker({ 
      position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
      map: map, 
      title: locations[i][0] 
     }); 
     } 
    } 
    </script> 

</head> 
<body> 
    <div id="map" style="width: 1000px; height: 700px;"></div> 
    <script type="text/javascript"> 

     window.onload = function() { 
     initialize(); 
     var locations = <?php echo json_encode($json); ?>; 
    //setInterval(function(){generateMarkers(locations);},1000); 
     generateMarkers(locations); 
    }; 
    </script> 
</body> 
</html>

我需要將數據放在其他文件？如果是的話該怎麼做？以及我如何才能在標記上進行刷新，而不是在頁面上進行刷新。
有什麼建議嗎？
謝謝！

來源

2013-07-16 Ofir Attia

爲什麼不使用Ajax民意調查？ – RomanGorbatko

使用JQuery $ .ajax（）;

的index.html：

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> 
    <title>Google Maps Multiple Markers</title> 
    <link href="https://google-developers.appspot.com/maps/documentation/javascript/examples/default.css" rel="stylesheet"> 
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script> 


    <script type="text/javascript"> 

    var map; 

    // Cretes the map 
    function initialize() { 
     map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 5, 
     center: new google.maps.LatLng(-33.92, 151.25), 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
     }); 
    } 

    // This function takes an array argument containing a list of marker data 
    function generateMarkers(locations) { 

     for (var i = 0; i < locations.length; i++) { 

     new google.maps.Marker({ 
      position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
      map: map, 
      title: locations[i][0] 
     }); 
     } 
    } 
    </script> 

</head> 
<body> 
    <div id="map" style="width: 1000px; height: 700px;"></div> 
    <script type="text/javascript"> 

     window.onload = function() { 
     initialize(); 
     setInterval(function() 
     { 
     $.ajax({ 
      url: "http://yoursite.com/location.php", 
      type: "POST", 
      data: {func: 'getLocation'}, 
      success: function(data) { 
      generateMarkers(data); 
      } 
     }); 
     }, 1000); 

    }; 
    </script> 
</body> 
</html>

location.php：

<?php 
include 'connect.php'; 

if (isset($_POST['func']) && $_POST['func'] === 'getLocation') 
{ 
     echo getLocation(); 

     function getLocation() 
     { 
       $json= array(); 
       $res = "SELECT LatLon,fname FROM customers"; 
       $res = mysql_query($res); 
       while($r = mysql_fetch_assoc($res)) { 

        $XY = explode(",",$r['LatLon']); 

        $json[]= array($r['fname'],$XY[1],$XY[0]); 

       } 

       return $json; 
     } 
} 
?>

試試吧！

來源

2013-07-16 21:42:43 RomanGorbatko

更新標記每X次更新一次

回答

相關問題