Returning turn-by-turn data from a route.

[nextzen]

Returning turn-by-turn data from a route.

[hanbyul-here]

Hi!
Mapzen's tutorial is mainly to spin up lrm-mapzen UI on the map. (and also, it is outdated! thanks for letting us be aware of that! we will update the page soon!)

but lrm-mapzen also lets you access to the response through callback. This behavior is documented on Leaflet Routing Machine docs.

so code snippet is going to be like this

// Create a map. Targets div with id 'map'.
var map = L.map('map');

var layer = Tangram.leafletLayer({
  scene: 'https://mapzen.com/carto/refill-style/refill-style.zip',
  attribution: '<a href="https://mapzen.com/tangram" target="_blank">Tangram</a> | <a href="http://www.openstreetmap.org/about" target="_blank">&copy; OSM contributors | <a href="https://mapzen.com/" target="_blank">Mapzen</a>',
}); // End of layer.

// Add's the styles and attributions to the map.
layer.addTo(map);

var sampleLatLngs = [L.Routing.waypoint(L.latLng(51.4998,-2.5468)), L.Routing.waypoint(L.latLng(51.5055,-2.5603))];
// You can grab free api key at https://mapzen.com/developers
var router = L.Routing.mapzen('your-api-key', {costing: 'pedestrian'});
// We are just going to print out route turned from the server
var sampleFunction = function(err, routes) {
  // Check your browser console
  console.log(routes);
}

router.route(sampleLatLngs, sampleFunction);

If you check your browser, you will see the response from the server. instructions property probably has the info you want. (instruction, maneuver type) . (Mind that you are going to need your own api key. Also the code snippet above is not going to show anything other than console since we didn't set the view of the map) !

I hope it helps!

[csalmeida]

That's perfect, got it now! I can't thank you enough for putting so much time into helping me with this issue @hanbyul-here!

[csalmeida]

Hi!

Thank you very much! That's what I was looking for. Do you know if there's a function that simplifies those routes as just (left, right, straight)? Either way that's already really good for what we are trying to achieve.

Thanks again @hanbyul-here, your explanation is very helpful!

[hanbyul-here]

@csalmeida There is no function helping it, but parsing routes is pretty straightforward.
Also, notice that our response has various types of instruction go to type part of the docs and check how many maneuver types are there!

You can access to this type number through instructionsproperty like this.

  for ( var i = 0; i < routes[0].instructions.length; i++) {
    // Getting maneuver type from instruction
     var maneuverType = routes[0].instructions[i].type;
     console.log(maneuverType);
  }

Then you can generate some instructions like left, sharp left with maneuverType variable's value.