使用php / mysql在g​​ooglemaps上动态绘制折线

我是googlemaps API的新手.我为我的手机编写了一个小应用程序,定期将其位置更新为sql数据库.

我想在浏览器中的googlemap上显示此信息.理想情况下,我想定期轮询数据库,如果有任何新的协议已经到达,请将它们添加到该行.

描述它的最佳方式是this.

为了到达那里,我开始在谷歌上的文件,并一直在修改它们,试图实现我想要的东西.它不起作用 – 我不知道为什么.我会喜欢一些关于原因的建议,并且非常欢迎任何指向我最终目标的指示.
    
    
      
       
       谷歌地图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尝试自定义代码之前.

有什么指针吗？我哪里出错？

解决方法:

你似乎走在了正确的轨道上.

您的PHP脚本应该接受timestamp参数,并应检查在该时间戳之后是否在数据库中插入了新点.如果是,它应该返回带有最新条目的响应(或者在该时间戳之后的条目列表,如果您想在车辆移动时显示实时路径).

在客户端,您可能希望使用normal或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);
       }
    });
}