Quick Overview
The leaflet-routing-machine
is a Leaflet plugin that provides advanced routing functionality, including support for multiple routing providers, waypoints, and customizable routing options. It is designed to be a powerful and flexible tool for building web-based mapping applications that require routing capabilities.
Pros
- Extensive Routing Functionality: The plugin supports a wide range of routing features, including support for multiple routing providers, waypoints, and customizable routing options.
- Customizable Appearance: The plugin allows for extensive customization of the appearance of the routing interface, including the ability to change the colors, icons, and other visual elements.
- Integrates Seamlessly with Leaflet: The plugin is designed to work seamlessly with the Leaflet mapping library, making it easy to integrate into existing Leaflet-based applications.
- Active Development and Community: The project has an active development team and a growing community of users and contributors, ensuring ongoing support and improvements.
Cons
- Dependency on Leaflet: The plugin is tightly coupled with the Leaflet mapping library, which may be a limitation for developers who are not using Leaflet in their projects.
- Limited Documentation: While the project has good documentation, it may not be as comprehensive or user-friendly as some developers would prefer.
- Performance Considerations: Depending on the complexity of the routing requirements and the size of the map, the plugin may have performance implications that need to be carefully considered.
- Potential Licensing Concerns: The project is licensed under the MIT license, which may not be suitable for all use cases.
Code Examples
Here are a few examples of how to use the leaflet-routing-machine
plugin:
- Basic Routing:
var map = L.map('map').setView([51.505, -0.09], 13);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
var control = L.Routing.control({
waypoints: [
L.latLng(51.5, -0.1),
L.latLng(51.5, -0.05)
]
}).addTo(map);
- Customizing the Routing Options:
var control = L.Routing.control({
waypoints: [
L.latLng(51.5, -0.1),
L.latLng(51.5, -0.05)
],
routeWhileDragging: true,
reverseWaypoints: true,
showAlternatives: true,
altLineOptions: {
styles: [
{color: 'black', opacity: 0.15, weight: 9},
{color: 'white', opacity: 0.8, weight: 6},
{color: 'blue', opacity: 0.5, weight: 2}
]
}
}).addTo(map);
- Using Multiple Routing Providers:
var control = L.Routing.control({
waypoints: [
L.latLng(51.5, -0.1),
L.latLng(51.5, -0.05)
],
routeWhileDragging: true,
router: L.Routing.osrm({
serviceUrl: 'https://router.project-osrm.org/route/v1'
}),
altRouter: L.Routing.mapbox({
apiKey: 'your-mapbox-api-key'
})
}).addTo(map);
Getting Started
To get started with the leaflet-routing-machine
plugin, follow these steps:
- Include the necessary dependencies in your HTML file:
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.7.1/dist
Convert
designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual CopilotREADME
Leaflet Routing Machine

This plugin is barely maintained! It has been a good long while since I had any reason to work with routing or Leaflet, and it does not look like that will change. I do not spend time on maintaining this plugin, and only rarely can I find time to respond to issues. If you want to take over as maintainer, feel free to contact me at per@liedman.net.
Find the way from A to B on a Leaflet map. The plugin supports multiple backends:
- OSRM - builtin and used by default (version 5)
- Mapbox Directions API - builtin with the class
L.Routing.Mapbox
- GraphHopper - through plugin lrm-graphopper
- Mapzen Valhalla - through plugin lrm-valhalla
- TomTom Online Routing API - through plugin lrm-tomtom by Mathias Rohnstock
- Legacy support for OSRM version 4 through plugin lrm-osrm4
- Esri - through plugin lrm-esri
Features
- Standard Leaflet control, with Leaflet look and feel
- Routing from start to destination, with possibility of via points
- Add, edit and remove waypoints through both address input and using the map
- Multiple language support
- Highly customizable for advanced use
- Customizable look (theming / skins)
- Open Source released under ISC License (more or less equivalent with the MIT license)
Go to the Leaflet Routing Machine site for more information, demos, tutorials and more.
Update 2020-04-06: Out of the box, Leaflet Routing Machine relies on OSRM's demo server. At this moment, the demo server (which is outside scope of the plugin and outside control of the plugin's author) is no longer maintained, and its SSL certificate has expired. The plugin will not work unless you configure a routing backend yourself. I am sorry to say that, to my knowledge, there is no good default.
Support and New Features
Leaflet Routing Machine is in many ways already a feature complete routing UI. Most likely, your requirements are already covered and require very little adaptation.
For questions and discussions, you might want to look at the Leaflet Routing Machine gitter.
Building
npm install
This requires Node and npm, as well as grunt
.
Usage
Download latest release, or obtain the latest release via unpkg.com.
<link rel="stylesheet" href="https://unpkg.com/leaflet-routing-machine@3.2.12/dist/leaflet-routing-machine.css" />
<script src="https://unpkg.com/leaflet-routing-machine@3.2.12/dist/leaflet-routing-machine.js"></script>
or via npm:
npm install --save leaflet-routing-machine
var L = require('leaflet');
require('leaflet-routing-machine');
...
LRM attaches itself onto L
.
Go to the Leaflet Routing Machine site for more information, demos, tutorials and more.
Convert
designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual Copilot