使用mapbox API进行Mapbox路由

我不擅长编码,目前正在使用mapbox API来创建带点的 Map . 但是在使用“geolocate”的用户位置和我的 Map 上的点之间的基本路由选项上找不到任何内容 . 有没有办法在API中执行此操作 . 我想为用户创建一个选项,以便找到我在 Map 上以及这些位置之间的位置 . 你的帮助将是最欣赏的 .

问候

回答(2)

2 years ago

Mapbox api中没有可用于 生产环境 的路由 . 他们正在预览中看到这里:https://www.mapbox.com/developers/api/directions/

mapbox的团队成员之一确实提出了另一种选择 . 看这里:https://stackoverflow.com/a/16305757/475882

2 years ago

我使用Mapbox.directions插件来执行此操作 . 我使用map contextmenu事件在某个位置获取右键单击事件(我的标记有可点击:false,因此 Map 会点击鼠标) . 我使用MouseEvent数据来获取latlng,并将其设置为路径的起点或终点 . 我允许插件查询路径并使用控件在 Map 上显示路线,说明和突出显示的路径 . 以下是一些片段:

$('#lblStatus').html("Calculating route....");

// **** units is not working yet in the current Mapbox release
moDirections = L.mapbox.directions({
    profile: 'mapbox.driving',
    units: 'metric'
});

moDirections.on('load', function (directions) {
    // Loop through all route coordinates and determine bounds for route.
    var minLat = 90, minLng = 180, maxLat = -90, maxLng = -180;
    var lat, lng;
    directions.routes[0].geometry.coordinates.forEach(function (laCoordinate, index) {
        lat = laCoordinate[1];
        lng = laCoordinate[0];
        if (lat < minLat) {
            minLat = lat;
        }
        if (lng < minLng) {
            minLng = lng;
        }
        if (lat > maxLat) {
            maxLat = lat;
        }
        if (lng > maxLng) {
            maxLng = lng;
        }
    });
    var loBounds = L.latLngBounds(L.latLng(minLat, minLng), L.latLng(maxLat, maxLng));
    moMap.fitBounds(loBounds);

    $('#lblStatus').html("");
});

moDirections.setOrigin(loStart);
moDirections.setDestination(loEnd);
moDirections.query();

moDirectionsLayer = L.mapbox.directions.layer(moDirections).addTo(moMap);
moDirectionsErrorsControl = L.mapbox.directions.errorsControl('pnlRouteErrors', moDirections);
moDirectionsRoutesControl = L.mapbox.directions.routesControl('pnlAlternateRoutes', moDirections);
moDirectionsInstructionsControl = L.mapbox.directions.instructionsControl('pnlRouteInstructions', moDirections);

上面的pnl *元素是注入控件的div .

目前基本上没有方向插件的文档 . 你可以在这里获得开源代码:https://github.com/mapbox/mapbox-directions.js

唯一的例子是:https://www.mapbox.com/mapbox.js/example/v1.0.0/mapbox-directions/但我发现输入控件不能正常工作并且不适合我的设计 .