leafletjs Routenlänge ausgeben

Communities Deutschland (Germany)
1

Hi,

bin ziemlich neu dabei mich mit OSM Maps zu beschäftigen.

Ich möchte in einem bestimmten DIV die länge der Route anzeigen lassen. Ich habe es schon soweit, das ich die Route ausgeben kann, aber die Kilometerangaben fehlen mir noch.

Kann mir da jemand helfen?

2

Schau mal da http://www.liedman.net/leaflet-routing-machine/

LG Tom

3

wenn ich richtig liege, geht es über das Template oder? aber wie binde ich das in ein eigenes div ein?

summaryTemplate: ‘

{name}

{distance}, {time}

’,

4

Kannst du mal den Code posten damit ich mir ein besseres Bild machen kann ?

LG Tom

5 
var map = L.map('map', { scrollWheelZoom: true }),
	waypoints = [
				L.latLng(52.548365, 13.407671),
				L.latLng(52.5375121, 13.4236475),
				L.latLng(52.5144239, 13.4654698),
				L.latLng(52.5142862, 13.4671353),
				L.latLng(52.5123855, 13.4782605),
				L.latLng(52.5081758, 13.4800137),
				L.latLng(52.5077505, 13.6094086),
				L.latLng(52.5207575, 13.6018098)
	];

L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
				attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
			}).addTo(map);

var control = L.Routing.control({
		plan: L.Routing.plan(waypoints, {
			createMarker: function(i, wp) {
				return L.marker(wp.latLng, {
					draggable: true,
					icon: L.icon.glyph({ glyph: String.fromCharCode(65 + i) })
				});
			},
			geocoder: L.Control.Geocoder.nominatim(),
			routeWhileDragging: true
		}),
		summaryTemplate: '<h3>Gesamtstrecke: {distance}, Fahrzeit: {time}</h3>',
		routeWhileDragging: true,
		language:'de',
		routeDragTimeout: 250,
		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)
	.on('routingerror', function(e) {
		try {
			map.getCenter();
		} catch (e) {
			map.fitBounds(L.latLngBounds(waypoints));
		}

		handleError(e);
	});
var entfernung = L.Routing.itinerary(distanceTemplate);
console.log(entfernung);