Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Leaflet - Draw road path in real-time based on two marker

Here's the sample of application that draw road path based on two markers enter image description here

Sorry I cannot search the tutorial to create this one because I cannot determine the right keyword.

All i want is to place two markers, then the road path will be created between those markers. It will adjust as one marker is moved.

Please provide insights on how this can be achieved. A sample code is much appreciated. Thank you in advance.

like image 746
Mellorine Avatar asked Mar 14 '16 13:03

Mellorine


People also ask

How do you connect two markers on a leaflet?

You will need to probably listen to the click event of each marker and add the markers to an array that contains your selected markers. You will just need to limit that array to two entries. This is not an optimal solution but should get you there and will allow you to easily extend if you want more than two markers.

How many markers can leaflet handle?

The Clusterer can handle 10,000 or even 50,000 markers (in chrome).

How do you find the current location in a leaflet?

Leaflet has a very handy shortcut for zooming the map view to the detected location — locate method with the setView option, replacing the usual setView method in the code: map. locate({setView: true, maxZoom: 16}); Here we specify 16 as the maximum zoom when setting the map view automatically.


1 Answers

This is OSRM, the Open Source Routing Machine. Here is a demo: http://map.project-osrm.org/

You can actually use it through HTTP request in any language you want: Python, javascript, java, C, ... Check the doc!

like image 104
Patrick Avatar answered Sep 21 '22 06:09

Patrick