刷新谷歌地圖javascript ajax

Question

我正在爲Android做兩個html5/javascript應用程序和phonegap，我讓他們都通過php與ajax通信，在他們兩個我使用谷歌地圖API，我需要知道在他們兩人在那裏的其他傢伙，而一個正在和另一個正在等待他的話，我有2個問題：

1. 在APP1（即移動的），我需要刷新標記每在地圖上10秒鐘，不加載整個頁面。

2. 我通過ajax，這兩個應用程序保存在mysql數據庫中的座標進行加載，因此我需要在每個地圖中設置第二個標記作爲其他應用程序位置，並且每隔10秒跟蹤它的移動。

這是怎麼了裝在每個應用程序映射：

function getPos() { 
     navigator.geolocation.getCurrentPosition(onSuccess, onError, {enableHighAccuracy:true}); 
     setTimeout(getPos, 10000); //call function after 10 seconds 
} 

function onSuccess(position) { 
    lat = position.coords.latitude; 
    lon = position.coords.longitude; 
    console.log("Found - LAT: ", lat, "LON: ", lon); 

    var currentposition = new google.maps.LatLng(lat,lon); 
    var mapoptions = { 
     zoom: 16, 
     center: currentposition, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     icon: image 
    }; 
    var map = new google.maps.Map(document.getElementById("map"), mapoptions); 
    var marker = new google.maps.Marker({ 
     position: currentposition, 
     map: map 
    }); 
    save_position_in_bd(); 
} 

function onError(error) { 
    console.log('code: ' + error.code, 'message: ' + error.message); 
} 

而且我有一個AJAX POST獲取其他應用程序的位置：

$.ajax({ 
    type: "POST", 
    url: "http://localhost/call.php", 
    data: "name=rui", 
    dataType: 'json', 
    success: function(data){ 
    lat = data.lat;//get other apps lat 
    lon = data.lon;//get other apps lon 
    }, 
    error: function(jqXHR, textStatus, errorThrown){ 
     console.log("POST: ", jqXHR, textStatus, errorThrown); 
    } 
}); 

能有什麼我確實解決了我的問題？我試圖刷新不同功能的地圖，並試圖只加載標記，但它不起作用。 此外，我現在用的是確切的API是：

http://maps.googleapis.com/maps/api/js?sensor=false 

解決它： 答案在不同的功能分割的代碼，並呼籲只有標記，以更新它：

function getPos() {//initial function to read the position 
     estado = "livre"; 
     navigator.geolocation.getCurrentPosition(onSuccess, onError, {enableHighAccuracy:true}); 
     setTimeout(keep_alive, 10000); //read every 10 seconds 
} 

function onSuccess(position) {//read map and mark it in the map 
    lat = position.coords.latitude; 
    lon = position.coords.longitude; 
    console.log("Found - LAT: ", lat, "LON: ", lon); 

    var image = '/img/taxi_green.png'; 
    var mapoptions = { 
     zoom: 16, 
     center: new google.maps.LatLng(lat,lon), 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     icon: image 
    }; 
    map = new google.maps.Map(document.getElementById("map"), mapoptions); 
    marker = new google.maps.Marker({ 
     position: new google.maps.LatLng(lat,lon), 
     map: map 
    }); 
    save_position(); 
} 

function keep_alive() {//read position and mark it in the map 
    navigator.geolocation.getCurrentPosition(onRefresh, onError, {enableHighAccuracy:true}); 
    save_position(); 
    setTimeout(keep_alive, 10000); //read every 10 seconds 
} 

//refresh only the marker 
function onRefresh(position) { 
    lat = position.coords.latitude; 
    lon = position.coords.longitude; 

    console.log("Found - LAT: ", lat, "LON: ", lon); 

    marker.setPosition(new google.maps.LatLng(lat, lon));//refresh marker 
    map.setCenter(new google.maps.LatLng(lat, lon));//resfresh center of the map 
} 

function trace_client() {//mark clients position in the map 
    //clientMarker.setPosition(new google.maps.LatLng(client_lat, client_lon)); 
    clientMarker = new google.maps.Marker({ 
     position: new google.maps.LatLng(client_lat,client_lon), 
     map: map 
    }); 
    console.log("client marked in the map"); 
} 

function onError(error) { 
    console.log('code: ' + error.code, 'message: ' + error.message); 
} 

Answer 1

爲了更容易找到，這裏是問題的解決方案。

答案是不同的功能分割的代碼，並呼籲只有標記，以更新它：

function getPos() {//initial function to read the position 
     estado = "livre"; 
     navigator.geolocation.getCurrentPosition(onSuccess, onError, {enableHighAccuracy:true}); 
     setTimeout(keep_alive, 10000); //read every 10 seconds 
} 

function onSuccess(position) {//read map and mark it in the map 
    lat = position.coords.latitude; 
    lon = position.coords.longitude; 
    console.log("Found - LAT: ", lat, "LON: ", lon); 

    var image = '/img/taxi_green.png'; 
    var mapoptions = { 
     zoom: 16, 
     center: new google.maps.LatLng(lat,lon), 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     icon: image 
    }; 
    map = new google.maps.Map(document.getElementById("map"), mapoptions); 
    marker = new google.maps.Marker({ 
     position: new google.maps.LatLng(lat,lon), 
     map: map 
    }); 
    save_position(); 
} 

function keep_alive() {//read position and mark it in the map 
    navigator.geolocation.getCurrentPosition(onRefresh, onError, {enableHighAccuracy:true}); 
    save_position(); 
    setTimeout(keep_alive, 10000); //read every 10 seconds 
} 

//refresh only the marker 
function onRefresh(position) { 
    lat = position.coords.latitude; 
    lon = position.coords.longitude; 

    console.log("Found - LAT: ", lat, "LON: ", lon); 

    marker.setPosition(new google.maps.LatLng(lat, lon));//refresh marker 
    map.setCenter(new google.maps.LatLng(lat, lon));//resfresh center of the map 
} 

function trace_client() {//mark clients position in the map 
    //clientMarker.setPosition(new google.maps.LatLng(client_lat, client_lon)); 
    clientMarker = new google.maps.Marker({ 
     position: new google.maps.LatLng(client_lat,client_lon), 
     map: map 
    }); 
    console.log("client marked in the map"); 
} 

function onError(error) { 
    console.log('code: ' + error.code, 'message: ' + error.message); 
}