Question

我有一个基于GPS的系统，可以向MYSQL数据库发送坐标。

使用此代码：

(function() {
    window.onload = function() {

        // Creating a new map
        var map = new google.maps.Map(document.getElementById("map"), {
          center: new google.maps.LatLng(41.65, -0.88),
          zoom: 1,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        });

        function createPoints(json){
        var infoWindow = new google.maps.InfoWindow();

        // Looping through the JSON data
        for (var i = 0, length = json.locations.length; i < length; i++) {

                var data = json.locations[i],
                latLng = new google.maps.LatLng(data.lat, data.long);

            var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/';
            var marker = new google.maps.Marker({
                position: latLng,
                map: map,
                title: data.nome,
                icon: iconBase + 'schools_maps.png'
                });


            (function(marker, data) {

                // Attaching a click event to the current marker
                google.maps.event.addListener(marker, "click", function(e) {
                    infoWindow.setContent(data.nome);
                    infoWindow.open(map, marker);
                });


            })(marker, data);
                         /* moveMarker( map, marker ); */

         }

        }


        // Get  the JSON data from PHP script

var json ;

$.getJSON("http://mywebservice/nmea_last.php").done(function(data) {
   json = data;
    createPoints(json);
});

    }

})();

Uding getJSON("http://mywebservice/nmea_last.php")句子，我得到gps发送（pediodically）到mysql的最后一个坐标，并且标记正确显示。我的问题是，我怎么能得到标记的动态刷新来捕捉地图上的运动？

我想我需要使用setTimeout方法（或不是？）但我不知道如何使用。有帮助吗？提前谢谢。

Answer 1

您可以使用ajax pull来获取每N毫秒的坐标：

var N = 1000; //every 1 second
var timeout = function() { 
  setTimeout(function()
  {
    $.getJSON("http://mywebservice/nmea_last.php").done(function(data) {
      json = data;
      createPoints(json);

      timeout(); //run again    
    }); 
  }, N); 
}

timeout();

Answer 2

尝试将getJSON调用更改为：

setTimeout( function() {
    $.getJSON("http://mywebservice/nmea_last.php").done(function(data) {
        json = data;
        createPoints(json);
    });
}, 5000);

5000表示延迟5秒，您可以根据屏幕刷新的时间进行调整。

Answer 3

我建议查看setInterval函数，您可以使用它定期调用函数。可以找到信息here。

我相信你会想要在setInterval函数中包装你的getJSON调用来拉取新点并刷新地图。这将是一个每5秒触发一次getJSON调用的示例：

setInterval(function() {
  $.getJSON("http://mywebservice/nmea_last.php").done(function(data) {
     json = data;
     createPoints(json);
  });
}, 5000);

JQuery - 刷新标记位置（获取移动）

3 个答案: