2013-02-09 133 views
0

我在这里遇到了一种情况。我试图使用传单JavaScript库在线地图上显示主题的当前位置。我的网站有两页。页面1具有地图显示并且页面2输入主题的当前位置并相应地设置地图。我正在使用蓝色标记来显示地图上的主题位置。 如果我加载页面1,标记显示正确,但如果我更新页面2上的位置,则在页面1上的地图上不会更新主体的位置。更新地图标记而不刷新页面 - 单张

这是我第-1代码:

<!DOCTYPE html> 
<html> 
<head> 
<title></title> 
<h1></h1> 
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.5/leaflet.css" /> 
<link rel="stylesheet" href="CSS/mystyle.css" /> 
<!--[if lte IE 8]> 
    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.5/leaflet.ie.css" /> 
<![endif]--> 
<script src="http://cdn.leafletjs.com/leaflet-0.5/leaflet.js"></script> 
<script src="SCRIPT/jquery-1.9.1.js"></script> 
<script src="SCRIPT/myscript.js"></script> 
</head> 

<body onload="LoadMap()"> 
<h2>Current location:</h2> 
<table border="1" id="currentloc_table"> 
    <tr> 
     <th>Name</th> 
     <th>IMEI</th> 
     <th>Latitude</th> 
     <th>Longitude</th> 
    </tr> 
    <tr> 
     <td>Azeem HTC Device</td> 
     <td>357710043411902</td> 
     <td></td> 
     <td></td> 
    </tr> 
</table> 
<br/><br/> 
<div id="map"></div> 
</body> 
</html> 

这里是myscript.js代码:

  var map; 
      var marker; 

      function LoadMap() 
      { 

       $.ajax({ 
         url: "../Database/getcurrentlocation.php?deviceId=357710043411902", 
         success: function(data){ 
          if(data!=null) 
          { 
           var dataArray = data.split(/~/); 
           SetMap(dataArray[0],dataArray[1]); 
          } 
         } 
         }); 


       setTimeout(function(){LoadMap();},10000); 
      } 

      function SetMap(lati,longi) 
      { 
       var loc_table = document.getElementById('currentloc_table'); 
       loc_table.rows[1].cells[2].innerHTML = lati; 
       loc_table.rows[1].cells[3].innerHTML = longi; 
       map = L.map('map').setView([lati, longi], 12); 
       L.tileLayer('http://{s}.tile.cloudmade.com/XXXXXXXXXXXXXXXXXXXXXXXXXXXX/997/256/{z}/{x}/{y}.png', { 
       attribution: '', 
       maxZoom: 18 
       }).addTo(map); 
       marker = L.marker([lati, longi]).addTo(map); 
      } 

,当我重新加载页面的地图被更新。但是,我可以在不执行页面1刷新的情况下使用新位置更新地图吗?

感谢

回答

1

只是把

setTimeout(function(){LoadMap();},10000); 

的LoadMap功能外