时间戳

首页 > 解决方案 > 使用 AJAX 自动更新标记

javascript - 使用 AJAX 自动更新标记

问题描述

我正在使用此代码从（数据库中的 db.php）获取 gps 数据，我需要更新标记而不刷新页面。我测试了 setInterval (function ())，它可以工作，但它会更新整个页面（地图 + 标记）。我只需要更新标记（变量 uluru）的位置，但我的问题是变量 uluru 是本地的

<html>
<head>
  <style>
      #map {
        height: 400px;
        width: 100%;
       }
    </style>
</head>
<body>
<div id="map"><b></b></div>
<div id="map2"><b>
  </b></div>

<script>


      var markers = [];
function loadmap(){
    
          var  xmlhttp = new XMLHttpRequest();
       
        xmlhttp.onreadystatechange = function () {
           if (this.readyState == 4 && this.status == 200) {
myObj = JSON.parse(this.responseText);
        var latt = myObj.name;
                var longg = myObj.name2;

                     uluru = {lat:+latt , lng:+longg };


map = new google.maps.Map(document.getElementById('map'), {
            zoom: 7,
            center:uluru,
          });
            
              addmarker(uluru);
                      

}
};
        xmlhttp.open("GET","db.php?q=",true);
        xmlhttp.send();
        
      }

                  function addmarker(location){
   var marker = new google.maps.Marker({ position: location, map: map });
                markers.push(marker);
              }
  
setInterval(function(){ loadmap() }, 1000);

</script>
<script
  async defer
    src="https://maps.googleapis.com/maps/api/js?key=AIzaSyD9J11XCcYDoT8-s0BD9sR4ARzIUmpI&callback=loadmap">
    </script>

</body>
</html>

标签： javascriptajaxdictionarymarker

解决方案

推荐阅读