-1
我是新的谷歌地圖,所以我想你的幫助,我想要做的是更新地圖與新位置而不刷新頁面,我使用ajax從終點獲取位置這些位置自動更新,但當我去我的網站時,我必須刷新它才能看到新的位置我不知道爲什麼它不起作用,有沒有解決方法,這裏是我的代碼如何更新谷歌地圖上的標記而不刷新
var map;
function initMap() {
var uluru = {lat: 29.91, lng: 31.21};
map = new google.maps.Map(document.getElementById('map'), {
zoom: 6,
center: uluru
});
// AJAX call to retrieve data from website
function getinformation() {
var xhttp;
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (xhttp.readyState == 4 && xhttp.status == 200) {
var result = xhttp.responseText, // response in order to be repeated
data = JSON.parse(result); // converting recieved JSON into array of objects
console.log(data);
var markers = [];
contents = [],
infowindows = [];
for (i = 0; i < data.length; i++) {
markers[i] = new google.maps.Marker({
position: {lat: data[i].lat, lng:data[i].long}, // modified to recieve all info even status
map: map,
animation: google.maps.Animation.BOUNCE
});
markers[i].index = i;
contents[i] = '<div class="popup_container" style="padding: 5px">' + data[i].status +'</div>';
console.log(markers);
infowindows[i] = new google.maps.InfoWindow({
content: contents[i],
maxWidth: 300
});
google.maps.event.addListener(markers[i], 'click', function() {
console.log(this.index); // this will give correct index
console.log(i); //this will always give 10 for you
infowindows[this.index].open(map,markers[this.index]);
map.panTo(markers[this.index].getPosition());
});
}
}
};
xhttp.open("GET", 'api/v1/record/all', true);
xhttp.send();
}
getinformation();
}
謝謝
thanx爲你的幫助,但如果你不介意可以ü請修改我的代碼,因爲我從這個新的api困惑 –