时间戳

首页 > 解决方案 > LEAFLETJS 获取航路点之间路线上的所有点

javascript - LEAFLETJS 获取航路点之间路线上的所有点

问题描述

[重复]我再次问这个问题，因为通过将下面的问题链接到我的问题，我的原始问题被错误地关闭了，但是提供的解决方案没有回答我的问题。

以前提供的“解决方案”：（从传单路由机获取航点） - 这个问题没有回答我的问题，因为答案只返回我已经提供的航点，它不返回构成路线的航点之间的点。

我最初的问题在这里：如何获取航点之间路线上的所有点？

我想为路线上的标记设置动画。我已经能够在航点之间成功地为标记设置动画，但我想以编程方式获取两个航点之间的点，以便我可以使用函数自动设置路线并沿路线设置动画。

将知道两个航路点，即 A 点和 B 点。我想要的是能够自动获取 A 点和 B 点之间的所有点，以便标记沿路线动画，而不是像乌鸦飞一样。我可以通过手动输入所需的航点成功地为路线设置动画，所以我知道如果我可以检索航点之间的点，这将起作用。

到目前为止，这是我的代码：

// Draw route

var routeData = L.Routing.control({
    router: L.Routing.mapbox(L.mapbox.accessToken,{
        profile : 'mapbox/driving',
        language: 'en',
    }),
    waypoints: [
        L.latLng(52.501737, -2.119792),
        L.latLng(52.498798, -2.102591)
    ],
    lineOptions:{
        styles: [
            {
                color: '#006a4e', opacity: 1, weight: 5
            }
        ],
    },
    draggableWaypoints: false,
    createMarker: function() { return false; },
    show: false,
}).addTo(mymap);

var routeArray = new Array();
routeArray = routeData.getWaypoints();

console.log(routeArray);

// Draw animation

L.motion.polyline([[52.501737, -2.119792], [52.501267, -2.114707], [52.500313, -2.110361], [52.499243, -2.108751], [52.498596, -2.105886], [52.498812, -2.104953], [52.498798, -2.102591]], {
    color: "transparent"
}, {
    auto: true,
    duration: 30000,
    easing: L.Motion.Ease.easeInOutQuart
}, {
    removeOnEnd: false,
    showMarker: true,
    icon: L.icon({iconUrl: 'marker.png', iconSize: [32,37]})
}).addTo(mymap);

计划是找到路点之间的点，将它们输入一个数组并在折线内分解数组，如下所示：

var pointsArray = new Array(???);
L.motion.polyline(pointsArray,...

我只是不知道如何获取 pointsArray 的数据。我正在使用带有 MapBox 数据的 Leaflet Routing Machine。

有什么帮助吗？

我希望我已经足够清楚地解释了自己。

标签： javascriptleafletmapbox

解决方案

推荐阅读