Question

我正在使用leaflet和pubnub库在Google地图上平滑移动标记，并提供实时数据。此功能正常工作，标记在地图上从一个点到下一个点平滑移动。

但我找不到用标记move事件从标记到目的地和尾随线绘制路径折线的方法。我希望显示与 Uber 相同的路线，从汽车图标到目的地和汽车移动的尾随线。

任何帮助都将不胜感激。

我正在使用以下pubnub SDK： https://www.pubnub.com/developers/eon/map/bus/

这是我的pubnub对象初始化代码：

var connectline = 0;
var lastlng = [40.80523269999999, -73.7412536];
var pubnub = new PubNub({
    publishKey: 'pub-c-5e4c8233-c59b-448c-a809-9c09f61715XX',
    subscribeKey: 'sub-c-74a7e51a-ad14-11e4-a808-02ee2ddab7XX'
});

var trip = '134386886'; // '134386875';
var channel = 'TRIP_' + trip;

alert("channel name=" + channel);

var map = eon.map({
    pubnub: pubnub,
    id: 'map',
    options: {
        center: new L.LatLng(40.80523269999999, -73.7412536),
        zoom: 15
    },
    mbId: 'ianjennings.l896mh2e',
    mbToken: 'pk.eyJ1IjoiaWFuamVubmluZ3MiLCJhIjoiZExwb0p5WSJ9.XLi48h-NOyJOCJuu1-h-Jg',
    channels:[channel],
    message: function (data) {
        map.setView(data[trip].latlng, 15);

    },
    transform: function(m) {
        var a = {};
        a[m.common.trip_id] = {
            latlng: [m.common.latitude, m.common.longitude],
            data: m.common
        }
        return a;
    },
    rotate: true,
    // history: true,
    marker: function (latlng, data) {
        var icon = new Icon();
        var parisKievLL = [lastlng, latlng];
        var marker = L.Marker.movingMarker(parisKievLL, [10000], {icon:icon}).addTo(map);
        lastlng = latlng;
        // alert('marker data=' + JSON.stringify(data));
        // alert('market latlng' + JSON.stringify(latlng));
        // var latlng = [data.latitude, data.longitude];
        var addressMarker = L.marker([40.80523269999999, -73.7412536]).addTo(map);
        marker.bindPopup('car #:' + data.device_id);
        return marker;
    }
});

在标记移动事件上的尾随路线折线

0 个答案: