leafletmapsmapboxleaflet-routing-machine

Leaflet Routing API: retrieve the legs data


I use the Leaflet Routing API, connected to Mapbox, to display a route with several waypoints. Now, I have to retrieve the distance and the time between these waypoints for some calculations...

I see that the api.mapbox.com/directions API (called via Leaflet) receives as result an array of legs between my waypoints, and all data I need (legs'' distance and duration):

routes: [,…]
0: {legs: [{summary: "A 35, D 415", weight: 4813.6, duration: 4594.8,…},…], weight_name: "routability",…}
distance: 447598.9
duration: 22889.300000000003
legs: [{summary: "A 35, D 415", weight: 4813.6, duration: 4594.8,…},…]
  0: {summary: "A 35, D 415", weight: 4813.6, duration: 4594.8,…}
    distance: 101906.2
    duration: 4594.8
    steps: [{intersections: [{out: 0, entry: [true], bearings: [301], location: [7.761832, 48.592052]},…],…},…]
    summary: "A 35, D 415" 
  1: {summary: "D 18bis, D 1bis", weight: 2070.1, duration: 1890.6,…}
    distance: 28743.3
    duration: 1890.6
    steps: [{intersections: [{out: 0, entry: [true], bearings: [310], location: [7.538932, 47.928985]}],…},…]
    summary: "D 18bis, D 1bis"
    weight: 2070.1
  2: {summary: "D 83, N 66", weight: 5097, duration: 4510.1,…}
  ...

I catch this result with a "routesfound" event, but I don't retrieve the legs from the result set:

{route: {…}, alternatives: Array(0), type: "routeselected", target: e, sourceTarget: e}
  alternatives: []
  route:
  coordinates: (8188) [M, M, M, M, M, M, M, M, …]
  inputWaypoints: (6) [e, e, e, e, e, e]
  instructions: (104) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, …]
  name: "A 35, D 415, D 18bis, D 1bis, D 83, N 66, Rue du Ballon d'Alsace, D 465, La Comtoise, L'Alsacienne"
  properties: {isSimplified: true}
  routesIndex: 0
  summary:
    totalDistance: 447598.9
    totalTime: 22889.300000000003
    __proto__: Object
  waypointIndices: (6) [0, 1611, 2100, 3485, 5808, 8187]
  waypoints: (6) [e, e, e, e, e, e]
  __proto__: Object
sourceTarget: e {options: {…}, _router: e, _plan: e, _requestCount: 1, _formatter: e, …}
target: e {options: {…}, _router: e, _plan: e, _requestCount: 1, _formatter: e, …}
type: "routeselected"

Is there a way to access the native result via Leaflet, or am I forced to do a duplicate call to the Mapbox API to bypass Leaflet ?


Solution

  • I have the same problem and I tried to get the response of the router. After digging into the code I found the _pendingRequest that hold the router XML HTTP request

    ACTIVE_DAY_ROUTE = L.Routing.control({
      show: false,
      waypoints: routeWaypoints,
      router: ROUTER,
      routeWhileDragging: false,
      draggableWaypoints: false,
      lineOptions: {
        styles: [{
          color: ROUTE_COLOR,
          opacity: ROUTE_OPACITY,
          weight: 4
        }]
      },
      createMarker: function() {
        return null;
      }
    });
    
    console.log(ACTIVE_DAY_ROUTE._pendingRequest.response);
    

    I succeed to get it on console.log but can't get the response attribute (perhaps because it is pending or finished when I try to get the value)

    UPDATE:

    I hacked the _convertRoute method to include legs in it

    var result = {
        name: '',
        coordinates: [],
        instructions: [],
        legs: '', // HACK HERE
        summary: {
          totalDistance: responseRoute.distance,
          totalTime: responseRoute.duration
        }
      },
    
    result.legs = responseRoute.legs; // HACK HERE - Affect leg