如何在離子應用程序中添加實時位置跟蹤

-2

我想將gmap導航等功能添加到離子混合應用程序中，如藍點指針。以前我使用過地理定位API，但是當我改變我的位置時（我似乎是靜態的），位置沒有改變。我想添加像谷歌地圖一樣的實時位置跟蹤。任何人都可以建議我正確的方式？如何在離子應用程序中添加實時位置跟蹤

來源

2017-04-22 Roshan Mule

https://www.pubnub.com/blog/2017-02-02-realtime-google-maps-tracking-and-live-geolocation-with-javascript/ – Edison

謝謝愛迪生，但我有一個問題，它真的可能只有通過使用谷歌API？如果我不想使用額外的依賴關係，那麼實現該目標的方法是什麼？ –

來自Google Maps API的'watchPosition（）'功能。它會返回您需要更改地圖中標記的所有信息。 – Cristiano

使用watchPosition和更改地圖上的標記。例如：

var myMarker = null; 

// get current position 
navigator.geolocation.getCurrentPosition(showPosition); 

// show current position on map 
function showPosition(position) { 
    myMarker = new google.maps.Marker({ 
     position: new google.maps.LatLng(position.coords.latitude, position.coords.longitude), 
     map: new google.maps.Map(document.getElementById("map")), 
     icon: 'img/icons/myicon.png' 
    }); 
} 

// watch user's position 
navigator.geolocation.watchPosition(watchSuccess, watchError, watchOptions); 

// change marker location everytime position is updated 
function watchSuccess(position) { 
    var latLng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); 
    // set marker position 
    marker.setPosition(latLng); 
}

您還可以使用$ cordovaGeolocation插件。看看插件文檔。

getCurrentPosition回報地理位置

watchPosition每次改變時間返回當前位置的當前位置。因此，使用此功能，您可以每次使用setPosition更改地圖上的標記並將座標傳遞給它。

來源

2017-04-23 00:46:51 Cristiano

它給出了很好的結果，但它顯示了每個位置更改後的舊標記，如何僅顯示一個標記（最新位置）。 –

謝謝克里斯蒂亞諾你的建議解決了我的問題。在你的代碼中有一個修正，而不是「marker.setPosition（latLng）;」我們需要寫「」myMarker.setPosition（latLng）; 「 –

您只需向map屬性應用本地方法setMyLocationEnabled(true)即可。

見我的例子：

設元件：HTML元素=的document.getElementById（ '映射'）;
this.map = this.googleMaps.create（element）;
this.map.setMyLocationEnabled（true）;

這最後一行將激活本地當前位置標記。

來源

2017-05-30 01:32:47

如何在離子應用程序中添加實時位置跟蹤

回答

相關問題