I don't quite get how to apply options to the leaflet routing machine. This is the basic code to use the routing :
var map = L.map('map');
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
L.Routing.control({
waypoints: [
L.latLng(57.74, 11.94),
L.latLng(57.6792, 11.949)
]
}).addTo(map);
Now, what I wanna do is, hide the itinerary text, from what I wrote in the API it should look like this :
L.Routing.itinerary({
show: false
}).addTo(map);
But this isn't working, when I try to make the markers not draggable and make the route not changeable it also doesn't work, I think I'm doing something wrong, 'cause I can change what ever I want in the code, it won't change anything about the display...
Basically what I wanna do is show a route that cannot be changed by dragging the markers and no itinerary text, in other words, you cannot change the original display.
Thanks for your time !
You can apply the option directly to L.Routing.Control
:
var routingControl = new L.Routing.Control({
waypoints: [
L.latLng(57.74, 11.94),
L.latLng(57.6792, 11.949)
],
show: false
}).addTo(map);
L.Routing.itinerary
is the baseclass for L.Routing.Control
. There is no need to create a instance of it. You've already got L.Routing.Control
added to your map. Since L.Routing.Control
is extended from L.Routing.Itinerary
it also inherits the show
option. See the API:
L.Routing.Control: Combining the other classes into a full routing user interface. The main class of the plugin. Extends L.Routing.Itinerary and implements IControl.
http://www.liedman.net/leaflet-routing-machine/api/#l-routing-control
I disabled draggable markers by overriding the createMarker function in the control.plan and passing draggable: false to the marker. Here is a snippet of a read-only leaflet map control configuration with routing machine.
var control, waypoints;
waypoints = [];
control = L.Routing.control({
waypoints: waypoints,
plan: L.Routing.plan(waypoints, {
createMarker: function(i, wp) {
return L.marker(wp.latLng, {
draggable: false
});
}
}),
addWaypoints: false,
routeWhileDragging: false,
show: false
}).addTo(map);
Another similar answer: here
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With