4

私はAndroid用のphonegapを使用して2つのhtml5 / javascriptアプリを実行しています。両方ともphpを介してajaxと通信しています。どちらもGoogleマップAPIを使用しており、両方で他の人がどこにいるかを知る必要があります、一方が移動中で、もう一方が彼を待っている間、2 つの質問があります。

  1. app1 (動いているもの) では、ページ全体を読み込まずに、マップ上で 10 秒ごとにマーカーを更新する必要があります。

  2. 両方のアプリのmysqlデータベースに保存されている座標であるajaxを介してロードしているため、各マップに2番目のマーカーを他のアプリの場所として設定し、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);
}
4

1 に答える 1

2

見つけやすくするために、ここに質問の解決策を示します。

答えは、コードを異なる関数に分割し、マーカーのみを呼び出して更新することです。

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);
}
于 2013-07-07T20:02:23.670 に答える