使用php/mysql在Google地圖上動態繪製多段線

Question

我是googlemaps API的新手。我爲我的手機寫了一個小應用程序，它定期將其位置更新爲SQL數據庫。

我想在我的瀏覽器的googlemap上顯示此信息。理想情況下，我想定期輪詢數據庫，如果有新的合作伙伴到達，請將它們添加到該行。

最佳描述它的方式是this。

在尋求到那裏，我已經開始在谷歌上的文件和被修改，以嘗試和acheive我想要的。它不起作用 - 我不知道爲什麼。我想爲什麼喜歡一些建議，並且對我的最終目標的任何指示都會非常受歡迎。 谷歌地圖AJAX + MySQL的/ PHP實例

<script type="text/javascript"> 
    //<![CDATA[ 

function load() { 
    if (GBrowserIsCompatible()) { 
    var map = new GMap2(document.getElementById("map")); 
    map.addControl(new GSmallMapControl()); 
    map.addControl(new GMapTypeControl()); 
    map.setCenter(new GLatLng(47.614495, -122.341861), 13); 

    GDownloadUrl("phpsqlajax_genxml.php", function(data) { 
     var xml = GXml.parse(data); 
     var line = []; 
     var markers = xml.documentElement.getElementsByTagName("points"); 
     for (var i = 0; i < points.length; i++) { 
      var point = points.item(i); 
      var lat = point.getAttribute("lat"); 
      var lng = point.getAttribute("lng"); 

      var latlng = new GLatLng(lat, lng); 

     line.push(latlng); 
     if (point.firstChild) { 
     var station = point.firstChild.nodeValue; 
     var marker = createMarker(latlng, station); 
     map.addOverlay(marker); 
     } 
    } 

    var polyline = new GPolyline(line, "#ff0000", 3, 1); 
    map.addOverlay(polyline); 
}); 
} 
//]]> 

我的PHP文件中生成以下XML;

<?xml version="1.0" encoding="UTF-8" ?> 
<points> 
<point lng="-122.340141" lat="47.608940"/> 
<point lng="-122.344391" lat="47.613590"/> 
<point lng="-122.356445" lat="47.624561"/> 
<point lng="-122.337654" lat="47.606365"/> 
<point lng="-122.345673" lat="47.612823"/> 
<point lng="-122.340363" lat="47.605961"/> 
<point lng="-122.345467" lat="47.613976"/> 
<point lng="-122.326584" lat="47.617214"/> 
<point lng="-122.342834" lat="47.610126"/> 
</points> 

我已經成功地完成了這個工作;嘗試自定義代碼之前，請嘗試使用http://code.google.com/apis/maps/articles/phpsqlajax.html。

任何指針？我哪裏出錯了？

Answer 1

你似乎是在正確的軌道上。

你的PHP腳本應該接受一個時間戳參數，應檢查是否有新的點都在戳後的數據庫中插入。如果是，則應返回最新條目的響應（或者在該時間戳之後的條目列表，如果您希望在車輛移動時顯示實時蹤跡）。

在客戶端，您可能需要使用普通或long polling以及上次更新的timestamp參數向服務器端腳本發起AJAX請求。

當你的AJAX請求從服務器接收新的信息，您只需在地圖上移動的標記。然後用更新的時間戳參數啓動一個新的AJAX請求。

僞上下的使用jQuery例如：

var lastUpdate = '2000/01/01 00:00:00'; 

function autoUpdate() { 
    $.ajax({ 
     type: "GET", 
     url: "phpsqlajax_genxml.php?last_update=" + lastUpdate, 
     dataType: 'xml', 
     success: function(xmlData) { 

      // 1. Check if the xmlData is empty. If not we received 
      // some fresh data. 
      // 2. Update lastUpdate from the xmlData with the timestamp from 
      // the server. Don't use JavaScript to update the timestamp, 
      // because the time on the client and on the server will 
      // never be exactly in sync. 
      // 3. Move the markers on Google Map. 

      // Relaunch the autoUpdate() function in 5 seconds. 
      setTimeout(autoUpdate, 5000); 
     } 
    }); 
}