Question

我是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。

任何指针？我哪里出错？

Answer 1

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

您的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);
       }
    });
}

使用php / mysql在谷歌地图上动态绘制折线

1 个答案: