通過實時服務提供商進行實時地理位置跟蹤

我想製作一個實時移動的地圖標記。每個地圖標記都用經度和緯度來描述。這些座標將被這需要user_id和type一個API提供：通過實時服務提供商進行實時地理位置跟蹤

var url = '/tracking/records/fetch'+ '&id=' + user_id +'&type='+type;

此端點返回JSON格式的一組latitude,longitude。

我的問題是我需要實時通信從該URL連續獲取數據。

如何實現與Google地圖一起的實時通信？標記將隨座標移動？

來源

2017-06-21 FightForJustice

這聽起來像是您的/tracking/records/fetch端點設置爲輪詢：您的網頁可以從服務器重複獲取整組座標，然後更新這些座標的地圖視圖。爲了實現這個目標，你需要從純粹的輪詢移動到推。

首先，sign up for a Pusher account。然後讓你的網頁連接到您的推應用和訂閱頻道的新座標：

<script src="//js.pusher.com/4.0/pusher.min.js"></script> 
<script> 
var pusher = new Pusher('YOUR_APP_KEY', { 
    cluster: 'YOUR_APP_CLUSTER' 
}); 
var tracking-records = pusher.subscribe('tracking-records-' + type + '-' + user_id); // Channel specific to this user 
tracking-records.bind('new-tracking-record', function(data) { 
    console.log('A new tracking record with latitude', data.latitude, 'and longitude', data.longitude); 
    // Update your Google Map view here using data.latitude, data.longitude 
}); 
</script>

那麼你的服務器上，查明跟蹤記錄被創建（可能是一個數據庫插入）。此時，將新座標發佈到tracking-records頻道。下面是Node.js的一個例子：

var Pusher = require('pusher'); 

var pusher = new Pusher({ 
    appId: 'APP_ID', 
    key: 'APP_KEY', 
    secret: 'APP_SECRET', 
    cluster: 'APP_CLUSTER' 
}); 

pusher.trigger(
    'tracking-records-' + type + '-' + user_id, // The channel name 
    'new-tracking-record', // The event type 
    {latitude: 51, longitude: 3} // The coordinate data 
);

有關更詳細的例子，推對how to track our pizza in realtime with Pusher and Google Maps的教程，並在how to build a realtime map using Laravel另一個教程。

來源

2017-06-21 10:22:11 jameshfisher

通過實時服務提供商進行實時地理位置跟蹤

回答

相關問題