如何自动加载谷歌地图

-1

请帮助我如何在给定的代码中使用AJAX在5秒内自动加载地图，以便数据库中的数据每隔5秒获取一次。在此代码中，每次获取地图中的新数据我必须刷新整个page.please帮我只加载地图在地图，以显示新的地方如何自动加载谷歌地图

#panel { 
     position: absolute; 
     top: 5px; 
     left: 50%; 
     margin-left: -180px; 
     width: 350px; 
     z-index: 5; 
     background-color: #fff; 
     padding: 5px; 
     border: 1px solid #999; 
     } 
html, body, #map { 
    height:500px; 
    width:920px; 
    margin: 0; 
} 
#latlng{ 
    width:225px; 
} 
</style> 
<title>maptest2 </title> 
<html> 
<!--<meta http-equiv="refresh" content="6">--> 
<script src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=weather"></script> 
<script type="text/javascript"> 


</script> 

<?php 


$tes=1; 
    mysql_connect('localhost','root',''); 
    mysql_select_db('gps_test1'); 

    ?> 
<div id="map"> </div> 


<?php 



$lat=27.693377; 
    $lon=85.282783; 



sleep(2); 
?> 
<?php $b=1; ?> 
<script type="text/javascript"> 

var linebreak = "<br />"; 
//document.write("For loop code is beginning") 
var add=[]; 
var arr=[]; 
var lat2=[]; 
var lon2=[]; 
<?php /* 

    var lat2= <?php echo json_encode($latt); ?>; 
    var lon2=<?php echo json_encode($lonn); ?>; 
*/?> 
var add=[]; 
var a; 
var j = 1; 
var i=1; 
var llat=<?php echo $lat ?>; 
var llon=<?php echo $lon ?>; 
function codeLatLng() { 

document.getElementById("add2").innerHTML=j; 
i=i+1; 
<?php 
    //print_r($row); 

//header("refresh: 3;"); 
    $sql=mysql_query("select * from tbl_latlng2 order by sno desc"); 

$row=mysql_fetch_assoc($sql); 

$latt=$row['lat']; 
$lonn=$row['lon']; 
$location=$row['location']; 
$sno=$row['sno']; 
$tes=$tes+1; 
sleep(2); 
?> 
    latlng = new google.maps.LatLng(<?php echo $latt ?> , <?php echo $lonn ?>);//lat2[j],lon2[j]); 

     map.setZoom(21); 
     var marker = new google.maps.Marker({ 
      position: latlng, 
      map: map, 
      center:latlng 
     }); 


     infowindow.setContent("<?php echo $location ?>"); 
     infowindow.open(map,marker); 
     marker.setMap(map); 

//document.getElementById("add").innerHTML=results[1].formatted_address; 
//document.getElementById("add2").innerHTML=Date(); 
document.getElementById("add").innerHTML="<?php echo $sno."now ".$tes ?>"; 

j=j+1; 
<?php 
header("Cache-Control: no-cache"); 
?> 
//window.setInterval(codeLatLng,5000); 
} 
setTimeout(codeLatLng,5000); 

function initialize(){ 
    infowindow = new google.maps.InfoWindow(); 
latlng=new google.maps.LatLng(<?php echo $lat ?>, <?php echo $lon ?>); 
geocoder=new google.maps.Geocoder(); 

var mapOptions = { 
    center:latlng, 
    zoom: 10, 
    mapTypeId: google.maps.MapTypeId.TERRAIN 
}; 
map = new google.maps.Map(document.getElementById('map'), mapOptions); 
} 



//google.maps.event.addDomListener(window,'load',initialize); 

google.maps.event.addDomListener(window,'load',initialize); 
</script> 


<body onLoad="codeLatLng()"> 

    <p id="add"></p> 
    <p id="add2"></p> 

    <script> 
    //document.write(add[3]); 
    </script> 

    </body> 
    </html>

来源

2013-10-02 Narayan Ghimire

，你必须使用某种功能，在通过所需的数据定期间隔称为是表现出对这样的地图SEE FIDDLE

setInterval(function(){ 
    lat++; //new latitude 
    lon++; //new longitued 
    showMap(lat, lon); 

}, 30000); //called in every 30 seconds

你的情况新拉特和长期将从阿贾克斯调用，然后传递给showMap函数

来源

2013-10-02 05:29:58

如何自动加载谷歌地图

回答

相关问题