leafletrouting
How to remove the whole container (see picture below) of leaflet-routing that includes distance and travel time via a button in my index.html?
If i remove line 3508 of leaflet-routing-machine.js: return this._container; the container is not visible. But this way is not an option.
Looking at an example of route : http://routes.cloudmade.com/8ee2a50541944fb9bcedded5165f09d9/api/0.3/47.25976,9.58423,47.26117,9.59882/car/shortest.js
You can adapt the function given on the post CloudMade Routing with Leaflet: route is not displayed to retrieve response.route_summary : there you will find total_distance and total_time.
At first, I thought it was something easy to do, but eventually I've lost almost half a day to come up with a solution.
The first version didn't seemed to have a practical use (only proved it is possible),
but it paved the way for the second solution, that may constitute a basis for interesting future developments.
The map can be panned, clicked and the zoom control is working properly.
Tested only on Chrome, Firefox, Opera and Internet Explorer 11.
Best Answer
Adding
show: falseandcollapsible: falseto the control didn't seem to do the trick. But you can manipulate the container's CSS with Javascript this way:To show it again later you can reverse this by doing: