Directions-Dienst

Mit Sammlungen den Überblick behalten Sie können Inhalte basierend auf Ihren Einstellungen speichern und kategorisieren.

Übersicht

Sie können Routen für verschiedene Transportmittel mithilfe des Objekts DirectionsService berechnen. Dieses Objekt kommuniziert mit dem Directions-Dienst der Google Maps API, der Wegbeschreibungsanfragen empfängt und einen effizienten Pfad zurückgibt. Die Fahrtzeit ist der primäre Faktor, der optimiert wird. Es werden jedoch auch andere Faktoren wie die Entfernung, die Anzahl der Abzweigungen und vieles mehr berücksichtigt. Sie können diese Routenergebnisse entweder selbst verarbeiten oder das Objekt DirectionsRenderer verwenden, um diese Ergebnisse zu rendern.

Wenn Sie den Start- oder Zielort in einer Wegbeschreibungsanfrage angeben, können Sie einen Abfragestring (z. B. &Chicago, IL" oder Darwin, NSW, Australien) oder einen LatLng-Wert oder ein Place-Objekt angeben.

Der Directions-Dienst kann mehrteilige Wegbeschreibungen mithilfe einer Reihe von Wegpunkten zurückgeben. Routen werden als Polylinie auf der Karte dargestellt oder zusätzlich als Textbeschreibung innerhalb eines <div>-Elements (z. B. „Biegen Sie rechts ab auf die Williamsburg Bridge-Rampe").

Erste Schritte

Bevor Sie den Directions-Dienst in der Maps JavaScript API verwenden, muss Directions API in der Google Cloud Console in dem Projekt aktiviert sein, das Sie für die Maps JavaScript API eingerichtet haben.

So zeigen Sie die Liste der aktivierten APIs an:

  1. Rufen Sie die Google Cloud Console auf.
  2. Klicken Sie auf die Schaltfläche Projekt auswählen, wählen Sie dasselbe Projekt aus, das Sie für die Maps JavaScript API eingerichtet haben, und klicken Sie auf Öffnen.
  3. Suchen Sie im Dashboard in der Liste der APIs nach Directions API.
  4. Wenn die API in der Liste angezeigt wird, sind Sie startbereit. Wenn die API nicht aufgeführt ist, aktivieren Sie sie:
    1. Wähle oben auf der Seite API AKTIVIEREN aus, um den Tab Bibliothek aufzurufen. Alternativ kannst du im Menü auf der linken Seite Mediathek auswählen.
    2. Suchen Sie nach der Directions API und wählen Sie sie in der Ergebnisliste aus.
    3. Wähle AKTIVIEREN aus. Wenn der Vorgang abgeschlossen ist, wird die Directions API in der Liste der APIs im Dashboard angezeigt.

Preise und Richtlinien

Preise

Am 16. Juli 2018 trat für Maps, Routes und Places ein neues „Pay as you go“-Preismodell in Kraft. Weitere Informationen zu den neuen Preisen und Nutzungslimits für die Verwendung des Directions-Dienstes von JavaScript finden Sie unter Nutzung und Abrechnung für die Directions API.

Ratenlimits

Beachten Sie die folgenden Hinweise zu Ratenbegrenzungen für zusätzliche Anfragen:

Das Ratenlimit wird pro Nutzersitzung angewendet, unabhängig davon, wie viele Nutzer dasselbe Projekt verwenden. Beim ersten Laden der API wird Ihnen ein anfängliches Kontingent von Anfragen zugewiesen. Wenn Sie dieses Kontingent verwenden, erzwingt die API Ratenbegrenzungen für zusätzliche Anfragen pro Sekunde. Wenn innerhalb eines bestimmten Zeitraums zu viele Anfragen gestellt werden, gibt die API einen OVER_QUERY_LIMIT-Antwortcode zurück.

Das Ratenlimit pro Sitzung verhindert die Verwendung von clientseitigen Diensten für Batchanfragen. Verwenden Sie für Batchanfragen den Directions API-Webdienst.

Richtlinien

Die Nutzung des Directions-Diensts muss den Richtlinien für die Directions API entsprechen.

Wegbeschreibungsanforderungen

Der Zugriff auf den Directions-Dienst ist asynchron, da die Google Maps API einen externen Server aufrufen muss. Aus diesem Grund müssen Sie eine Callback-Methode übergeben, die bei Abschluss der Anfrage ausgeführt wird. Diese Callback-Methode sollte die Ergebnisse verarbeiten. Der Directions-Dienst kann mehr als einen möglichen Reiseplan als Array mit separaten routes[] zurückgeben.

Wenn Sie Wegbeschreibungen in der Maps JavaScript API verwenden möchten, erstellen Sie ein Objekt vom Typ DirectionsService und rufen Sie DirectionsService.route() auf, um eine Anfrage an den Directions-Dienst zu initiieren. Dabei übergeben Sie ein DirectionsRequest-Objektliteral, das die Eingabebedingungen und eine Callback-Methode enthält, die bei Eingang der Antwort ausgeführt werden soll.

Das Objektliteral DirectionsRequest enthält die folgenden Felder:

{
  origin: LatLng | String | google.maps.Place,
  destination: LatLng | String | google.maps.Place,
  travelMode: TravelMode,
  transitOptions: TransitOptions,
  drivingOptions: DrivingOptions,
  unitSystem: UnitSystem,
  waypoints[]: DirectionsWaypoint,
  optimizeWaypoints: Boolean,
  provideRouteAlternatives: Boolean,
  avoidFerries: Boolean,
  avoidHighways: Boolean,
  avoidTolls: Boolean,
  region: String
}

Diese Felder werden im Folgenden beschrieben:

  • origin (erforderlich) gibt den Ausgangspunkt an, von dem aus die Route berechnet werden soll. Dieser Wert kann als String (z. B. „Chicago, IL"“), als LatLng-Wert oder als Place-Objekt angegeben werden. Wenn Sie ein Place-Objekt verwenden, können Sie eine Orts-ID, einen Abfragestring oder einen LatLng-Standort angeben. Sie können Orts-IDs aus den Geocoding-, Place Search- und Place Autocomplete-Diensten in der Maps JavaScript API abrufen. Ein Beispiel mit Place IDs von Place Autocomplete finden Sie hier.
  • destination (erforderlich) gibt den Zielort an, zu dem hin die Route berechnet werden soll. Die Optionen sind mit denen im oben beschriebenen Feld origin identisch.
  • travelMode (erforderlich): Gibt an, welche Transportart bei der Berechnung der Route verwendet werden soll. Die gültigen Werte sind weiter unten im Abschnitt Reisemodi aufgeführt.
  • transitOptions (optional) gibt Werte an, die nur für Anfragen gelten, bei denen travelMode TRANSIT ist. Gültige Werte werden weiter unten im Abschnitt Optionen für öffentliche Verkehrsmittel beschrieben.
  • drivingOptions (optional) gibt Werte an, die nur für Anfragen gelten, bei denen travelMode DRIVING ist. Gültige Werte sind weiter unten im Abschnitt Optionen für Kraftfahrzeuge beschrieben.
  • unitSystem (optional) gibt an, welches Einheitensystem für die Anzeige der Ergebnisse verwendet werden soll. Die gültigen Werte sind weiter unten im Abschnitt Maßeinheitensysteme angegeben.

  • waypoints[] (optional) gibt ein Array von DirectionsWaypoint-Werten an. Wegpunkte ändern eine Route, indem sie sie über die angegebenen Standorte führen. Ein Wegpunkt wird als Objektliteral mit den folgenden Feldern angegeben:

    • location gibt den Standort des Wegpunkts als LatLng, als Place-Objekt oder als String an, der dann geocodiert wird.
    • stopover ist ein boolescher Wert, der angibt, dass der Wegpunkt eine Haltestelle auf der Route ist. Dies führt dazu, dass die Route in zwei Routen aufgeteilt wird.

    Weitere Informationen zu Wegpunkten finden Sie unten im Abschnitt Wegpunkte in Routen verwenden.

  • optimizeWaypoints (optional) gibt an, dass die Route anhand des bereitgestellten waypoints optimiert werden kann. Dazu werden die Wegpunkte in einer effizienteren Reihenfolge angeordnet. Bei true gibt der Directions-Dienst die neu angeordnete waypoints in einem waypoint_order-Feld zurück. Weitere Informationen finden Sie unten im Abschnitt Wegpunkte in Routen verwenden.
  • provideRouteAlternatives (optional): Wenn dieser Wert auf true gesetzt ist, gibt der Directions-Dienst mehr als eine Routenalternative in der Antwort an. Beachten Sie, dass sich durch die Bereitstellung von Routenalternativen die Antwortzeit des Servers verlängern kann. Diese Option ist nur für Anfragen ohne Wegpunkte verfügbar.
  • avoidFerries (optional): Wenn dieser Wert auf true gesetzt ist, sollten die berechneten Routen nach Möglichkeit keine Fähren enthalten.
  • avoidHighways (optional): Der Wert true gibt an, dass bei den berechneten Routen Autobahnen möglichst vermieden werden sollen.
  • avoidTolls (optional): Der Wert true gibt an, dass bei den berechneten Routen mautpflichtige Straßen möglichst vermieden werden sollen.
  • region (optional) gibt den Regionscode in Form eines zweistelligen ccTLD-Werts ("Top-Level-Domain") an. Weitere Informationen finden Sie unten im Abschnitt Gewichtung nach Region.

Hier ein Beispiel für DirectionsRequest:

{
  origin: 'Chicago, IL',
  destination: 'Los Angeles, CA',
  waypoints: [
    {
      location: 'Joplin, MO',
      stopover: false
    },{
      location: 'Oklahoma City, OK',
      stopover: true
    }],
  provideRouteAlternatives: false,
  travelMode: 'DRIVING',
  drivingOptions: {
    departureTime: new Date(/* now, or future date */),
    trafficModel: 'pessimistic'
  },
  unitSystem: google.maps.UnitSystem.IMPERIAL
}

Verkehrsmittel

Bei der Berechnung der Route müssen Sie die gewünschte Fortbewegungsart angeben. Die folgenden Fortbewegungsarten werden derzeit unterstützt:

  • DRIVING (Standard) gibt die standardmäßigen Wegbeschreibungen über das Straßennetz an.
  • BICYCLING fordert Fahrradrouten unter Verwendung von Fahrradwegen und bevorzugten Straßen an.
  • TRANSIT fordert Routen mit öffentlichen Verkehrsmitteln an.
  • WALKING fordert Routen mit Fußgängerwegen und Gehsteigen an.

In den Details zur Google Maps Platform-Abdeckung können Sie nachlesen, inwiefern ein Land Routen unterstützt. Wenn Sie eine Route für eine Region anfordern, in der dieser Richtungstyp nicht verfügbar ist, wird in der Antwort DirectionsStatus="ZERO_RESULTS" zurückgegeben.

Hinweis: Fußgängerrouten enthalten unter Umständen keine klaren Fußgängerwege. In diesen Fällen werden Warnungen im DirectionsResult zurückgegeben, das angezeigt werden muss, wenn Sie nicht das standardmäßige DirectionsRenderer verwenden.

Optionen für öffentliche Verkehrsmittel

Die verfügbaren Optionen für eine Wegbeschreibungsanforderung kann abhängig vom Verkehrsmittel variieren. Wenn Routen für öffentliche Verkehrsmittel angefordert werden, werden die Optionen avoidHighways, avoidTolls, waypoints[] und optimizeWaypoints ignoriert. Spezifische Routingoptionen für öffentliche Verkehrsmittel können Sie über das Objektliteral TransitOptions angeben.

Wegbeschreibungen für öffentliche Verkehrsmittel sind zeitsensitiv. Routen werden nur für zukünftige Zeiten zurückgegeben.

Das Objektliteral TransitOptions enthält die folgenden Felder:

{
  arrivalTime: Date,
  departureTime: Date,
  modes[]: TransitMode,
  routingPreference: TransitRoutePreference
}

Diese Felder werden im Folgenden beschrieben:

  • arrivalTime (optional) gibt die gewünschte Ankunftszeit als Date-Objekt an. Wenn die Ankunftszeit angegeben ist, wird die Abfahrtszeit ignoriert.
  • departureTime (optional) gibt die gewünschte Abfahrtszeit als Date-Objekt an. departureTime wird ignoriert, wenn arrivalTime angegeben ist. Wenn kein Wert für departureTime oder arrivalTime angegeben ist, wird standardmäßig die aktuelle Uhrzeit verwendet.
  • modes[] (optional) ist ein Array, das ein oder mehrere TransitMode-Objektliterale enthält. Dieses Feld darf nur enthalten sein, wenn die Anfrage einen API-Schlüssel enthält. Für jede TransitMode wird ein bevorzugtes Verkehrsmittel angegeben. Folgende Werte sind zulässig:
    • BUS gibt an, dass die berechnete Route mit dem Bus bevorzugt werden soll.
    • RAIL gibt an, dass für die berechnete Route Züge, Straßenbahnen, Stadtbahnen und U-Bahnen bevorzugt werden sollen.
    • SUBWAY gibt an, dass die berechnete Route mit der U-Bahn bevorzugt werden soll.
    • TRAIN gibt an, dass die berechnete Route mit dem Zug bevorzugt werden soll.
    • TRAM gibt an, dass für die berechnete Route Straßenbahnen und Stadtbahnen bevorzugt werden sollen.
  • routingPreference (optional) gibt Einstellungen für Routen mit öffentlichen Verkehrsmitteln an. Mit dieser Option können Sie die zurückgegebenen Optionen anpassen, anstatt die von der API ausgewählte beste Standardroute zu akzeptieren. Dieses Feld darf nur angegeben werden, wenn die Anfrage einen API-Schlüssel enthält. Folgende Werte sind zulässig:
    • FEWER_TRANSFERS gibt an, dass die berechnete Route eine begrenzte Anzahl von Umstiegen vorziehen soll.
    • LESS_WALKING gibt an, dass für die berechnete Route nur wenige Fußwege bevorzugt werden sollen.

Hier ein Beispiel für DirectionsRequest mit öffentlichen Verkehrsmitteln:

{
  origin: 'Hoboken NJ',
  destination: 'Carroll Gardens, Brooklyn',
  travelMode: 'TRANSIT',
  transitOptions: {
    departureTime: new Date(1337675679473),
    modes: ['BUS'],
    routingPreference: 'FEWER_TRANSFERS'
  },
  unitSystem: google.maps.UnitSystem.IMPERIAL
}

Optionen für Kraftfahrzeuge

Mit dem Objekt DrivingOptions können Sie Routingoptionen für Wegbeschreibungen angeben.

Das Objekt DrivingOptions enthält die folgenden Felder:

{
  departureTime: Date,
  trafficModel: TrafficModel
}

Diese Felder werden im Folgenden beschrieben:

  • departureTime (erforderlich, damit das Objektliteral drivingOptions gültig ist) gibt die gewünschte Abfahrtszeit als Date-Objekt an. Als Wert muss die aktuelle oder eine Zeit in der Zukunft festgelegt werden. Er darf nicht in der Vergangenheit liegen. Die API wandelt alle Datumsangaben in UTC um, um eine konsistente Verarbeitung in allen Zeitzonen sicherzustellen. Wenn du für Kunden der Google Maps Platform-Premiumoption die departureTime in die Anfrage aufnimmst, gibt die API die beste Route unter Berücksichtigung der erwarteten Verkehrslage zum Zeitpunkt zurück und schließt die vorhergesagte Zeit im Traffic (duration_in_traffic) in die Antwort ein. Wenn Sie keine Abfahrtszeit angeben, d. h. wenn die Anfrage drivingOptions nicht enthält, ist die zurückgegebene Route im Allgemeinen eine gute Route, ohne die Verkehrslage zu berücksichtigen.
  • trafficModel (optional) gibt die Annahmen an, die bei der Berechnung der Zeit im Traffic verwendet werden sollen. Diese Einstellung wirkt sich auf den Wert aus, der im Feld duration_in_traffic in der Antwort zurückgegeben wird. Sie enthält die vorhergesagte Zeit im Traffic, basierend auf den bisherigen Durchschnittswerten. Die Standardeinstellung ist bestguess. Folgende Werte sind zulässig:
    • bestguess (Standard) gibt an, dass die zurückgegebene duration_in_traffic die beste Schätzung der Fahrzeit sein soll, wenn man die bisherigen Verkehrsverhältnisse und die aktuelle Verkehrslage kennt. Je näher der departureTime an der Zeit ist, desto wichtiger wird der Livetraffic.
    • pessimistic gibt an, dass der zurückgegebene duration_in_traffic an den meisten Tagen länger als die tatsächliche Reisezeit sein sollte. Gelegentlich können Tage mit besonders schlechten Verkehrsdaten diesen Wert jedoch überschreiten.
    • optimistic gibt an, dass der zurückgegebene duration_in_traffic an den meisten Tagen kürzer als die tatsächliche Reisezeit sein sollte. Gelegentlich können Tage mit besonders guter Verkehrslage jedoch schneller als dieser Wert sein.

Hier ein Beispiel für den DirectionsRequest einer Wegbeschreibung:

{
  origin: 'Chicago, IL',
  destination: 'Los Angeles, CA',
  travelMode: 'DRIVING',
  drivingOptions: {
    departureTime: new Date(Date.now() + N),  // for the time N milliseconds from now.
    trafficModel: 'optimistic'
  }
}

Einheitensysteme

Standardmäßig werden die Routen in dem Maßeinheitensystem des Ursprungsorts oder der Region berechnet und angezeigt. Hinweis: Für Ursprünge, die anstelle von Adressen in Breiten- und Längengraden angegeben werden, werden standardmäßig immer Maßeinheiten verwendet. Zum Beispiel werden für eine Route von Chicago, IL, ON und ONT Ergebnisse in Meilen und für die umgekehrte Route in Kilometern angezeigt. Sie können dieses Maßeinheitensystem überschreiben, indem Sie eines in der Anfrage explizit mit einem der folgenden UnitSystem-Werte festlegen:

  • UnitSystem.METRIC gibt die Nutzung des Messwertsystems an. Entfernungen werden in Kilometern angegeben.
  • UnitSystem.IMPERIAL gibt die Nutzung des Imperial-Systems (Englisch) an. Entfernungen werden in Meilen angegeben.

Hinweis: Diese Einstellung für das Maßeinheitensystem wirkt sich nur auf den Text aus, der dem Nutzer angezeigt wird. Das Routenergebnis enthält auch Werte für die Entfernung, die dem Nutzer nicht angezeigt werden und immer in Metern ausgedrückt werden.

Anforderung mit Regionsangabe für Wegbeschreibungen

Der Directions-Dienst der Google Maps API gibt Adressergebnisse zurück, die von der Domain (Region oder Land) beeinflusst werden, aus der Sie den JavaScript-Bootstrap geladen haben. Da https://maps.googleapis.com/ von den meisten Nutzern geladen wird, wird eine implizite Domain für die USA festgelegt. Wenn Sie den Bootstrap von einer anderen unterstützten Domain aus laden, werden die Ergebnisse von dieser Domain beeinflusst. Beispielsweise können Suchanfragen nach „San Francisco“ zu unterschiedlichen Ergebnissen für Anwendungen führen, die „https://maps.googleapis.com/“ (USA) laden, als für „http://maps.google.es/“ (Spanien).

Sie können auch mithilfe des Parameters region festlegen, dass der Directions-Dienst nach bestimmten Regionen gewichtete Ergebnisse zurückgibt. Für diesen Parameter wird ein Regionscode verwendet, der als zweistelliges (nicht numerisches) Unicode-Regions-Tag angegeben ist. In den meisten Fällen sind diese Tags direkt den zweistelligen ccTLD-Werten ("top-level domain") wie „"uk" in "co.uk" zugeordnet. In einigen Fällen unterstützt das region-Tag auch ISO-3166-1-Codes, die sich teilweise von den ccTLD-Werten unterscheiden (z. B. „&GB“ für „Vereinigtes Königreich“).

Wenn Sie den Parameter region verwenden:

  • Geben Sie nur ein Land oder eine Region an. Mehrere Werte werden ignoriert und können zu einer fehlgeschlagenen Anfrage führen.
  • Verwenden Sie nur zweistellige Regions-Subtags (Unicode CLDR-Format). Alle anderen Eingaben führen zu Fehlern.

Die Quellengewichtung nach Region wird nur für die Länder und Regionen unterstützt, die Wegbeschreibungen unterstützen. In den Details zur Google Maps Platform-Abdeckung finden Sie Informationen zur internationalen Abdeckung für die Directions API.

Wiedergabe von Wegbeschreibungen

Zum Initiieren einer Wegbeschreibungsanfrage an DirectionsService mit der Methode route() muss ein Callback übergeben werden, das nach der Ausführung der Dienstanfrage ausgeführt wird. Dieser Callback gibt einen DirectionsResult- und einen DirectionsStatus-Code in der Antwort zurück.

Status der Wegbeschreibungsabfrage

DirectionsStatus kann folgende Werte zurückgeben:

  • OK gibt an, dass die Antwort eine gültige DirectionsResult enthält.
  • NOT_FOUND gibt an, dass mindestens einer der in der Anfrage angegebenen Start-, Zielort- oder Wegpunkte nicht geocodiert werden konnte.
  • ZERO_RESULTS gibt an, dass keine Route zwischen Start- und Zielort gefunden werden konnte.
  • MAX_WAYPOINTS_EXCEEDED gibt an, dass zu viele DirectionsWaypoint-Felder in DirectionsRequest angegeben wurden. Weitere Informationen finden Sie unten im Abschnitt Limits für Wegpunkte.
  • MAX_ROUTE_LENGTH_EXCEEDED gibt an, dass die angeforderte Route zu lang ist und nicht verarbeitet werden kann. Dieser Fehler tritt auf, wenn komplexere Wegbeschreibungen zurückgegeben werden. Verringern Sie die Anzahl der Wegpunkte, Abzweigungen oder Anweisungen.
  • INVALID_REQUEST gibt an, dass der angegebene DirectionsRequest ungültig war. Die häufigste Ursache für diesen Fehlercode sind Anfragen ohne Ausgangs- oder Zielort oder eine Transitanfrage mit Wegpunkten.
  • OVER_QUERY_LIMIT gibt an, dass die Webseite innerhalb des zulässigen Zeitraums zu viele Anfragen gesendet hat.
  • REQUEST_DENIED gibt an, dass die Webseite den Routenplanerdienst nicht verwenden darf.
  • UNKNOWN_ERROR gibt an, dass eine Routenanfrage aufgrund eines Serverfehlers nicht verarbeitet werden konnte. Die Anfrage ist möglicherweise erfolgreich, wenn Sie es noch einmal versuchen.

Überprüfen Sie, ob die Routenabfrage gültige Ergebnisse zurückgegeben hat. Prüfen Sie dazu diesen Wert, bevor Sie das Ergebnis verarbeiten.

Anzeigen des DirectionsResult s

DirectionsResult enthält das Ergebnis der Routenanfrage. Dieses kannst du entweder selbst verarbeiten oder an ein DirectionsRenderer-Objekt übergeben, das die Darstellung des Ergebnisses auf einer Karte automatisch übernimmt.

So rufst du DirectionsResult mit einem DirectionsRenderer auf:

  1. Erstellen Sie ein DirectionsRenderer-Objekt.
  2. Rufen Sie setMap() für den Renderer auf, um ihn an die übergebene Karte zu binden.
  3. Rufen Sie setDirections() für den Renderer auf und übergeben Sie DirectionsResult wie oben beschrieben. Da der Renderer ein MVCObject ist, erkennt er automatisch Änderungen an seinen Attributen und aktualisiert die Karte, wenn sich die zugehörigen Routen geändert haben.

Im folgenden Beispiel wird die Route zwischen zwei Standorten an der Route 66 berechnet. Dabei werden der Ausgangs- und der Zielort durch die angegebenen "start"- und "end"-Werte in den Drop-down-Listen festgelegt. Mit DirectionsRenderer werden die Darstellung der Polylinie zwischen den angegebenen Standorten sowie die Platzierung von Markierungen am Start- und Zielort sowie ggf. Wegpunkten festgelegt.

function initMap() {
  var directionsService = new google.maps.DirectionsService();
  var directionsRenderer = new google.maps.DirectionsRenderer();
  var chicago = new google.maps.LatLng(41.850033, -87.6500523);
  var mapOptions = {
    zoom:7,
    center: chicago
  }
  var map = new google.maps.Map(document.getElementById('map'), mapOptions);
  directionsRenderer.setMap(map);
}

function calcRoute() {
  var start = document.getElementById('start').value;
  var end = document.getElementById('end').value;
  var request = {
    origin: start,
    destination: end,
    travelMode: 'DRIVING'
  };
  directionsService.route(request, function(result, status) {
    if (status == 'OK') {
      directionsRenderer.setDirections(result);
    }
  });
}

Im HTML-Textkörper:

<div>
<strong>Start: </strong>
<select id="start" onchange="calcRoute();">
  <option value="chicago, il">Chicago</option>
  <option value="st louis, mo">St Louis</option>
  <option value="joplin, mo">Joplin, MO</option>
  <option value="oklahoma city, ok">Oklahoma City</option>
  <option value="amarillo, tx">Amarillo</option>
  <option value="gallup, nm">Gallup, NM</option>
  <option value="flagstaff, az">Flagstaff, AZ</option>
  <option value="winona, az">Winona</option>
  <option value="kingman, az">Kingman</option>
  <option value="barstow, ca">Barstow</option>
  <option value="san bernardino, ca">San Bernardino</option>
  <option value="los angeles, ca">Los Angeles</option>
</select>
<strong>End: </strong>
<select id="end" onchange="calcRoute();">
  <option value="chicago, il">Chicago</option>
  <option value="st louis, mo">St Louis</option>
  <option value="joplin, mo">Joplin, MO</option>
  <option value="oklahoma city, ok">Oklahoma City</option>
  <option value="amarillo, tx">Amarillo</option>
  <option value="gallup, nm">Gallup, NM</option>
  <option value="flagstaff, az">Flagstaff, AZ</option>
  <option value="winona, az">Winona</option>
  <option value="kingman, az">Kingman</option>
  <option value="barstow, ca">Barstow</option>
  <option value="san bernardino, ca">San Bernardino</option>
  <option value="los angeles, ca">Los Angeles</option>
</select>
</div>

Beispiel ansehen

Das folgende Beispiel zeigt Wegbeschreibungen mit verschiedenen Fortbewegungsarten zwischen Haight-Ashbury und Ocean Beach in San Francisco:

function initMap() {
  var directionsService = new google.maps.DirectionsService();
  var directionsRenderer = new google.maps.DirectionsRenderer();
  var haight = new google.maps.LatLng(37.7699298, -122.4469157);
  var oceanBeach = new google.maps.LatLng(37.7683909618184, -122.51089453697205);
  var mapOptions = {
    zoom: 14,
    center: haight
  }
  var map = new google.maps.Map(document.getElementById('map'), mapOptions);
  directionsRenderer.setMap(map);
}

function calcRoute() {
  var selectedMode = document.getElementById('mode').value;
  var request = {
      origin: haight,
      destination: oceanBeach,
      // Note that JavaScript allows us to access the constant
      // using square brackets and a string value as its
      // "property."
      travelMode: google.maps.TravelMode[selectedMode]
  };
  directionsService.route(request, function(response, status) {
    if (status == 'OK') {
      directionsRenderer.setDirections(response);
    }
  });
}

Im HTML-Textkörper:

<div>
<strong>Mode of Travel: </strong>
<select id="mode" onchange="calcRoute();">
  <option value="DRIVING">Driving</option>
  <option value="WALKING">Walking</option>
  <option value="BICYCLING">Bicycling</option>
  <option value="TRANSIT">Transit</option>
</select>
</div>

Beispiel ansehen

Ein DirectionsRenderer verarbeitet nicht nur die Anzeige der Polylinie und aller zugehörigen Markierungen, sondern kann auch die Textdarstellung von Routen als eine Reihe von Schritten verarbeiten. Rufe dazu setPanel() auf deinem DirectionsRenderer auf und übergib den <div>, in dem diese Informationen angezeigt werden sollen. Dadurch werden auch die entsprechenden Urheberrechtshinweise und ggf. mit dem Ergebnis verbundenen Warnungen angezeigt.

Für Wegbeschreibungen in Textform wird die Spracheinstellung des Browsers verwendet oder die Sprache, die beim Laden des API-JavaScript-Codes mit dem Parameter language angegeben wird. Weitere Informationen findest du unter Lokalisierung. Bei Routen mit öffentlichen Verkehrsmitteln wird die Zeit in der Zeitzone der jeweiligen Haltestelle angezeigt.

Das folgende Beispiel ist mit dem obigen Beispiel identisch, enthält jedoch einen <div>-Bereich, in dem die Route angezeigt wird:

function initMap() {
  var directionsService = new google.maps.DirectionsService();
  var directionsRenderer = new google.maps.DirectionsRenderer();
  var chicago = new google.maps.LatLng(41.850033, -87.6500523);
  var mapOptions = {
    zoom:7,
    center: chicago
  }
  var map = new google.maps.Map(document.getElementById('map'), mapOptions);
  directionsRenderer.setMap(map);
  directionsRenderer.setPanel(document.getElementById('directionsPanel'));
}

function calcRoute() {
  var start = document.getElementById('start').value;
  var end = document.getElementById('end').value;
  var request = {
    origin:start,
    destination:end,
    travelMode: 'DRIVING'
  };
  directionsService.route(request, function(response, status) {
    if (status == 'OK') {
      directionsRenderer.setDirections(response);
    }
  });
}

Im HTML-Textkörper:

<div id="map" style="float:left;width:70%;height:100%"></div>
<div id="directionsPanel" style="float:right;width:30%;height:100%"></div>

Beispiel ansehen

Objekt „DirectionsResult“

Wenn Sie eine Routenanfrage an DirectionsService senden, erhalten Sie eine Antwort, die aus einem Statuscode und einem Ergebnis besteht. Letzteres ist ein DirectionsResult-Objekt. DirectionsResult ist ein Objektliteral, das die folgenden Felder enthält:

  • geocoded_waypoints[] enthält ein Array mit DirectionsGeocodedWaypoint-Objekten, von denen jedes Details zur Geocodierung von Ausgangsort, Zielort und Wegpunkten enthält.
  • routes[] enthält ein Array von DirectionsRoute-Objekten. Jede Route gibt einen Weg an, der vom Ausgangs- zum Zielort im DirectionsRequest führt. Im Allgemeinen wird für eine Anfrage nur eine Route zurückgegeben, es sei denn, für das Feld provideRouteAlternatives der Anfrage wurde true festgelegt. In diesem Fall können mehrere Routen zurückgegeben werden.

Hinweis: Das Attribut via_waypoint wurde in alternativen Routen eingestellt. Version 3.27 ist die letzte Version der API, die zusätzliche Wegpunkte in alternativen Routen hinzufügt. In Version 3.28 und höher der API können Sie weiterhin dragbare Routen über den Directions-Dienst implementieren, indem Sie das Ziehen alternativer Routen deaktivieren. Nur die Hauptstraße kann gezogen werden. Nutzer können die Hauptroute ziehen, bis sie einer alternativen Route entspricht.

Wegbeschreibung mit geocodierten Wegpunkten

Ein DirectionsGeocodedWaypoint enthält Details zum Geocoding von Ausgangsort, Zielort und Wegpunkten.

DirectionsGeocodedWaypoint ist ein Objektliteral, das die folgenden Felder enthält:

  • geocoder_status gibt den Statuscode an, der sich aus dem Geocoding-Vorgang ergibt. Dieses Feld kann folgende Werte enthalten:
    • "OK" gibt an, dass keine Fehler aufgetreten sind. Die Adresse wurde erfolgreich geparst und mindestens ein Geocode zurückgegeben.
    • "ZERO_RESULTS" gibt an, dass der Geocode erfolgreich war, aber keine Ergebnisse zurückgegeben hat. Dieser Fehler kann auftreten, wenn dem Geocoder ein nicht vorhandenes address übergeben wurde.
  • partial_match gibt an, dass der Geocoder keine genaue Übereinstimmung für die ursprüngliche Anfrage zurückgegeben hat, aber teilweise mit der angeforderten Adresse übereinstimmt. Prüfen Sie die ursprüngliche Anfrage auf Rechtschreibfehler und/oder eine unvollständige Adresse.

    Teilübereinstimmungen treten am häufigsten bei Adressen auf, die nicht innerhalb des Orts vorhanden sind, den Sie in der Anfrage angeben. Teilübereinstimmungen können auch zurückgegeben werden, wenn eine Anfrage mit zwei oder mehr Standorten am selben Ort übereinstimmt. So gibt beispielsweise "Hillpar St, Bristol, UK&hl=de eine Teilübereinstimmung für die Henry Street und die Henrietta Street zurück. Wenn eine Anfrage eine falsch geschriebene Adresskomponente enthält, schlägt der Geocoding-Dienst möglicherweise eine alternative Adresse vor. Vorschläge, die auf diese Weise ausgelöst werden, werden auch als Teilübereinstimmung gekennzeichnet.

  • place_id ist eine eindeutige Kennung für einen Ort, die mit anderen Google APIs verwendet werden kann. Du kannst beispielsweise place_id mit der Google Places API verwenden, um Details zu einem lokalen Unternehmen wie Telefonnummer, Öffnungszeiten oder Rezensionen von Nutzern abzurufen. Weitere Informationen finden Sie unter Orts-ID.
  • types[] ist ein Array, das den Typ des zurückgegebenen Ergebnisses angibt. Dieses Array enthält eine Reihe von null oder mehr Tags, die den Typ des im Ergebnis zurückgegebenen Merkmals angeben. Beispiel: Der Geocode von & quot;Chicago" gibt "locality" zurück, der angibt, dass "Chicago" einer Stadt entspricht, sowie "political", was bedeutet, dass es eine politische Einheit ist.

Wegbeschreibungsrouten

Hinweis: Das alte DirectionsTrip-Objekt wurde in DirectionsRoute umbenannt. Eine Route bezieht sich jetzt nicht mehr auf einen Streckenabschnitt einer übergeordneten Fahrt, sondern auf die gesamte Reise vom Anfang bis zum Ende.

Ein DirectionsRoute enthält ein einzelnes Ergebnis für den angegebenen Start- und Zielort. Diese Route kann aus einem oder mehreren Streckenabschnitten des Typs DirectionsLeg bestehen, je nachdem, ob Wegpunkte angegeben wurden. Außerdem enthält die Route Urheberrechtshinweise und Warnungen, die dem Nutzer zusätzlich zu den Routeninformationen angezeigt werden müssen.

DirectionsRoute ist ein Objektliteral, das die folgenden Felder enthält:

  • legs[] enthält ein Array mit DirectionsLeg-Objekten, von denen jedes Informationen über einen Streckenabschnitt zwischen zwei Standorten der angegebenen Route enthält. Für jeden angegebenen Wegpunkt oder Zielort ist ein separater Streckenabschnitt vorhanden. Eine Route ohne Wegpunkte enthält genau ein DirectionsLeg. Jeder Streckenabschnitt besteht aus einer Reihe von DirectionSteps.
  • waypoint_order enthält ein Array, das die Reihenfolge aller Wegpunkte in der berechneten Route angibt. Dieses Array kann eine alternative Reihenfolge enthalten, wenn DirectionsRequest an optimizeWaypoints: true übergeben wurde.
  • overview_path enthält ein Array mit LatLng-Werten, die einen ungefähren (geglätteten) Pfad der Ergebnisroute darstellen.
  • overview_polyline enthält ein einzelnes points-Objekt, das eine codierte Polylinie enthält. Diese Polylinie ist ein ungefährer (geglätteter) Pfad der Ergebnisroute.
  • bounds enthält einen LatLngBounds-Wert, der die Grenzen der Polylinie entlang der Route angibt.
  • copyrights enthält den Urheberrechtstext, der für diese Route angezeigt werden soll.
  • warnings[] enthält ein Array mit Warnungen, die bei der Anzeige dieser Route angezeigt werden müssen. Wenn Sie das bereitgestellte DirectionsRenderer-Objekt nicht verwenden, müssen Sie diese Warnungen selbst verarbeiten und anzeigen.
  • fare enthält den Gesamtpreis (also die gesamten Ticketkosten) auf dieser Route. Dieses Attribut wird nur für Anfragen für öffentliche Verkehrsmittel und nur für Routen zurückgegeben, bei denen Preisinformationen für alle Abschnitte des öffentlichen Verkehrsmittels verfügbar sind. Dazu gehören:
    • currency: Ein Währungscode nach ISO 4217, der die Währung angibt, in der der Betrag ausgedrückt wird.
    • value: Der Gesamtbetrag des Preises in der oben angegebenen Währung.

Wegbeschreibungsabschnitte

Hinweis: Das alte DirectionsRoute-Objekt wurde in DirectionsLeg umbenannt.

Ein DirectionsLeg definiert einen einzelnen Streckenabschnitt einer Route vom Start- zum Zielort in der berechneten Route. Routen ohne Wegpunkte bestehen aus einem einzelnen „leg“-Abschnitt. Bei Routen, die einen oder mehrere Wegpunkte definieren, besteht die Route aus einem oder mehreren Streckenabschnitten, die den jeweiligen Streckenabschnitten entsprechen.

DirectionsLeg ist ein Objektliteral, das die folgenden Felder enthält:

  • steps[] enthält ein Array mit DirectionsStep-Objekten, die Informationen über jeden einzelnen Schritt des Streckenabschnitts enthalten.
  • distance gibt die von diesem Streckenabschnitt zurückgelegte Gesamtstrecke als Distance-Objekt der folgenden Form an:

    • value gibt die Entfernung in Metern an.
    • text enthält eine Stringdarstellung der Entfernung, die standardmäßig im Maßeinheitensystem des Ursprungsorts angezeigt wird. So werden beispielsweise für alle Ursprünge in den USA Meilen verwendet. Sie können dieses Maßeinheitensystem überschreiben, indem Sie in der ursprünglichen Abfrage ein UnitSystem festlegen. Unabhängig davon, welches Maßeinheitensystem Sie verwenden, enthält das Feld distance.value immer einen in Metern angegebenen Wert.

    Diese Felder sind möglicherweise nicht definiert, wenn die Entfernung nicht bekannt ist.

  • duration gibt die Gesamtdauer dieses Streckenabschnitts als Duration-Objekt der folgenden Form an:

    • value gibt die Dauer in Sekunden an.
    • text enthält eine Stringdarstellung der Dauer.

    Diese Felder sind möglicherweise nicht definiert, wenn die Dauer nicht bekannt ist.

  • duration_in_traffic gibt die Gesamtdauer dieses Streckenabschnitts an und berücksichtigt dabei die aktuelle Verkehrslage. duration_in_traffic wird nur zurückgegeben, wenn alle der folgenden Bedingungen erfüllt sind:

    • Die Anforderung enthält keine Wegpunkte mit Aufenthalt. Das heißt, sie enthält keine Wegpunkte, wobei stopover den Wert true hat.
    • Die Anfrage bezieht sich speziell auf Wegbeschreibungen – mode ist auf driving gesetzt.
    • departureTime ist Teil des Felds drivingOptions in der Anfrage.
    • Für die angeforderte Route sind Informationen über die Verkehrsbedingungen verfügbar.

    duration_in_traffic enthält die folgenden Felder:

    • value gibt die Dauer in Sekunden an.
    • text enthält eine visuell lesbare Darstellung der Dauer.
  • arrival_time enthält die geschätzte Ankunftszeit für diesen Streckenabschnitt. Diese Eigenschaft wird nur bei Anforderungen für öffentliche Verkehrsmittel zurückgegeben. Das Ergebnis wird als Time-Objekt mit drei Properties zurückgegeben:
    • value ist die als JavaScript-Date-Objekt angegebene Zeit.
    • text ist die als String angegebene Zeit. Die Zeit wird in der Zeitzone der Haltestelle angezeigt.
    • time_zone enthält die Zeitzone dieser Haltestelle. Der Wert ist der Name der Zeitzone, die in der IANA-Zeitzonendatenbank definiert ist, z.B. "America/New_York".
  • departure_time enthält die geschätzte Abfahrtszeit für diesen Streckenabschnitt und wird als Time-Objekt angegeben. Die departure_time ist nur für Routen mit öffentlichen Verkehrsmitteln verfügbar.
  • start_location enthält die LatLng des Ursprungs dieses Streckenabschnitts. Da der Directions-Webdienst die Route zwischen Standorten unter Verwendung der Transportoption berechnet, die am nächsten bei den Start- und Endpunkten liegt (normalerweise eine Straße), kann start_location vom angegebenen Ursprungsort dieses Streckenabschnitts abweichen, beispielsweise falls sich keine Straße in der Nähe des Ausgangsorts befindet.
  • end_location enthält die LatLng des Ziels dieses Streckenabschnitts. Da DirectionsService die Route zwischen Standorten unter Verwendung der Transportoption berechnet, die am nächsten bei den Start- und Endpunkten liegt (normalerweise eine Straße), kann end_location vom angegebenen Ziel dieses Streckenabschnitts abweichen, beispielsweise falls sich keine Straße in der Nähe des Ziels befindet.
  • start_address enthält die Klartextadresse für den Beginn dieses Streckenabschnitts, normalerweise eine Adresse.

    Dieser Inhalt ist so zu lesen, wie er ist, aber die formatierte Adresse nicht programmatisch zu parsen.
  • end_address enthält die Klartextadresse für das Ende dieses Streckenabschnitts, normalerweise eine Adresse.

    Dieser Inhalt ist so zu lesen, wie er ist, aber die formatierte Adresse nicht programmatisch zu parsen.

Schritte in Wegbeschreibungen

Eine DirectionsStep ist die kleinste Einheit einer Route. Sie enthält einen einzelnen Schritt, der eine spezifische, einzelne Anweisung auf der Route beschreibt. Z. B. „W bei links abbiegen 4th St. Im Schritt wird nicht nur die Anleitung beschrieben, sondern es werden auch Informationen zur Entfernung und Dauer für den nächsten Schritt angezeigt. Beispiel: Ein Schritt, der als &Weiter auf I-80 West dargestellt wird, kann eine Dauer von 37 Meilen (48 km) und 40 Minuten enthalten und gibt an, dass der nächste Schritt 37 Meilen/40 Minuten von diesem Schritt entfernt ist.

Wenn Sie mit dem Directions-Dienst nach Routen für öffentliche Verkehrsmittel suchen, enthält das Array „steps“ zusätzliche spezifische Informationen zu öffentlichen Verkehrsmitteln in Form eines transit-Objekts. Wenn die Route mehrere Transportmittel umfasst, werden detaillierte Routen für Fußgänger und Autofahrer in einem steps[]-Array bereitgestellt. Beispiel für einen Fußweg für die Route: Start- und Zielpunkt: " Weg nach Innes Ave & Fitch St" Dieser Schritt enthält detaillierte Fußgängerrouten für diese Route im Array steps[], wie z. B. "Head north-west", "Links auf Arelious Walker" und "Links auf Innes Ave" abbiegen.

DirectionsStep ist ein Objektliteral, das die folgenden Felder enthält:

  • instructions enthält eine Anleitung für diesen Schritt in einem Textstring.
  • distance enthält die von diesem Schritt abgedeckte Entfernung bis zum nächsten Schritt als Distance-Objekt. Weitere Informationen finden Sie in der Beschreibung zu DirectionsLeg oben. Dieses Feld ist möglicherweise nicht definiert, wenn die Entfernung unbekannt ist.
  • duration enthält eine Schätzung der Zeit, die zum Ausführen des Schritts bis zum nächsten Schritt erforderlich ist, und zwar als Duration-Objekt. Weitere Informationen finden Sie in der Beschreibung zu DirectionsLeg oben. Dieses Feld ist möglicherweise nicht definiert, wenn die Dauer unbekannt ist.
  • start_location enthält die geocodierte LatLng des Startpunkts dieses Schritts.
  • end_location enthält die LatLng des Endpunkts dieses Schritts.
  • polyline enthält ein einzelnes points-Objekt, das eine codierte Polylinie des Schritts enthält. Diese Polylinie ist ein ungefährer (geglätteter) Pfad des Schritts.
  • steps[] ist ein DirectionsStep-Objektliteral, das detaillierte Routen für Fußgänger oder Autofahrer mit Wegbeschreibungen in öffentlichen Verkehrsmitteln enthält. Teilschritte sind nur für öffentliche Verkehrsmittel verfügbar.
  • travel_mode enthält die in diesem Schritt verwendete TravelMode. Routen für öffentliche Verkehrsmittel können eine Kombination aus Fußgängerrouten und öffentlichen Verkehrsmitteln enthalten.
  • path enthält ein Array mit LatLngs zur Beschreibung des Verlaufs dieses Schritts.
  • transit enthält Informationen zu öffentlichen Verkehrsmitteln, z. B. Ankunfts- und Abfahrtszeiten sowie den Namen der ÖPNV-Linie.

Spezielle Informationen zu öffentlichen Verkehrsmitteln.

Wegbeschreibungen für öffentliche Verkehrsmittel geben zusätzliche Informationen zurück, die für andere Transportmittel nicht relevant sind. Diese zusätzlichen Properties werden über das Objekt TransitDetails verfügbar gemacht, das als Attribut von DirectionsStep zurückgegeben wird. Über das Objekt TransitDetails kannst du wie unten beschrieben auf zusätzliche Informationen für die Objekte TransitStop, TransitLine, TransitAgency und VehicleType zugreifen.

Informationen zu öffentlichen Verkehrsmitteln

Das Objekt TransitDetails stellt die folgenden Properties bereit:

  • arrival_stop enthält ein TransitStop-Objekt, das die Ankunftshaltestelle mit den folgenden Properties darstellt:
    • name ist der Name der Haltestelle. z. B. &Unt-Platz
    • location der Standort der Haltestelle, angegeben als LatLng.
  • departure_stop enthält ein TransitStop-Objekt, das die Abfahrtshaltestelle darstellt.
  • arrival_time enthält die Ankunftszeit und wird als Time-Objekt mit drei Properties angegeben:
    • value ist die als JavaScript-Date-Objekt angegebene Zeit.
    • text ist die als String angegebene Zeit. Die Zeit wird in der Zeitzone der Haltestelle angezeigt.
    • time_zone enthält die Zeitzone dieser Haltestelle. Der Wert ist der Name der Zeitzone, die in der IANA-Zeitzonendatenbank definiert ist, z.B. "America/New_York".
  • departure_time enthält die Abfahrtszeit und wird als Time-Objekt angegeben.
  • headsign gibt die Fahrtrichtung auf dieser Linie an, die auf dem Fahrzeug oder an der Haltestelle angegeben ist. Oft ist dies der Name der Endhaltestelle.
  • headway (sofern verfügbar) gibt die erwartete Anzahl von Sekunden zwischen Abfahrten von derselben Haltestelle zu diesem Zeitpunkt an. Wenn Sie beispielsweise einen headway-Wert von 600 angeben, müssen Sie mit einer zehnminütigen Wartezeit rechnen, falls Sie Ihren Bus nicht erreichen sollten.
  • line enthält ein TransitLine-Objektliteral, das Informationen zu der in diesem Schritt verwendeten Linie enthält. TransitLine gibt den Namen und Operator der Linie sowie andere Attribute an, die in der Referenzdokumentation zu TransitLine beschrieben sind.
  • num_stops enthält die Anzahl der Haltestellen in diesem Schritt. Hierbei wird die Ankunftshaltestelle mitgezählt, die Abfahrtshaltestelle jedoch nicht. Beispiel: Wenn die Route bei Haltestelle A beginnt, die Haltestellen B und C überquert und bei Haltestelle D ankommt, gibt num_stops den Wert 3 zurück.

Verkehrslinie

Das Objekt TransitLine stellt die folgenden Attribute bereit:

  • name enthält den vollständigen Namen der ÖPNV-Linie, z. B. &7 Express Express oder 14th St Crosstown"
  • short_name enthält den Kurznamen dieser ÖPNV-Linie. Dies ist normalerweise eine Nummer wie "2" oder "M14".
  • agencies ist ein Array, das ein einzelnes TransitAgency-Objekt enthält. Das Objekt TransitAgency stellt Informationen zum Operator dieser Zeile bereit, darunter die folgenden Properties:
    • name enthält den Namen des Betreibers.
    • phone enthält die Telefonnummer des Betreibers.
    • url enthält die URL des Betreibers.

    Hinweis: Wenn Sie Routen mit öffentlichen Verkehrsmitteln manuell rendern, statt das Objekt DirectionsRenderer zu verwenden, müssen die Namen und URLs der Betreiber angezeigt werden.

  • url enthält eine URL für diese Linie, wie vom Betreiber angegeben.
  • icon enthält eine URL für das mit dieser Zeile verknüpfte Symbol. Die meisten Orte verwenden allgemeine Symbole, die nach Art des Verkehrsmittels variieren können. Einige ÖPNV-Linien, z. B. das New Yorker U-Bahn-System, haben ein spezielles Symbol.
  • color enthält die Farbe, die in der Beschilderung dieses öffentlichen Verkehrsmittels häufig verwendet wird. Die Farbe wird als Hexadezimalwert wie z. B. #FF0033 angegeben.
  • text_color enthält die Farbe des Texts, die in der Ausschilderung dieser Linie im Allgemeinen verwendet wird. Die Farbe wird als Hexadezimalwert angegeben.
  • vehicle enthält ein Vehicle-Objekt, das die folgenden Properties enthält:
    • name enthält den Namen des Fahrzeugs auf dieser Linie. z. B. &U-Bahn."
    • type enthält den auf dieser Linie verwendeten Fahrzeugtyp. Eine vollständige Liste der unterstützten Werte finden Sie in der Dokumentation zum Fahrzeugtyp.
    • icon enthält eine URL für das Symbol, das normalerweise diesem Fahrzeugtyp zugeordnet ist.
    • local_icon enthält die URL des Symbols für diesen Fahrzeugtyp, je nach Beschilderung des jeweiligen Transportunternehmens.

Fahrzeugtyp

Das Objekt VehicleType stellt die folgenden Properties bereit:

Wert Definition
VehicleType.RAIL Bahn
VehicleType.METRO_RAIL Stadtbahn
VehicleType.SUBWAY Unterirdische Stadtbahn
VehicleType.TRAM Oberirdische Stadtbahn
VehicleType.MONORAIL Einschienenbahn
VehicleType.HEAVY_RAIL Eisenbahn
VehicleType.COMMUTER_TRAIN Pendlerbahn
VehicleType.HIGH_SPEED_TRAIN Schnellzug
VehicleType.BUS Bus
VehicleType.INTERCITY_BUS Fernbus
VehicleType.TROLLEYBUS Oberleitungsbus
VehicleType.SHARE_TAXI Sammeltaxis sind eine Art Bus, der Fahrgäste überall ein- und aussteigen kann.
VehicleType.FERRY Fähre
VehicleType.CABLE_CAR Ein Fahrzeug, das sich - normalerweise am Boden - mithilfe eines Kabels bewegt. Luftseilbahnen haben den Typ VehicleType.GONDOLA_LIFT.
VehicleType.GONDOLA_LIFT Gondelbahn, eine Art Luftseilbahn.
VehicleType.FUNICULAR Standseilbahn. Eine Standseilbahn besteht in der Regel aus zwei Autos, wobei jedes Auto als Gegengewicht dient.
VehicleType.OTHER Alle anderen Fahrzeuge geben diesen Typ zurück.

DirectionsResults überprüfen

Die DirectionsResults-Komponenten – DirectionsRoute, DirectionsLeg, DirectionsStep und TransitDetails – können beim Parsen von Routenantworten geprüft und verwendet werden.

Wichtig: Wenn Sie Routen mit öffentlichen Verkehrsmitteln manuell rendern, statt das Objekt DirectionsRenderer zu verwenden, müssen die Namen und URLs der Betreiber angezeigt werden, die die Ergebnisse bereitstellen.

Im folgenden Beispiel wird die Fußgängerroute zu bestimmten Touristenattraktionen in New York City dargestellt. Wir prüfen die DirectionsStep der Route, um Markierungen für die einzelnen Schritte hinzuzufügen und eine InfoWindow mit einer Anleitung für den jeweiligen Schritt anzuhängen.

Hinweis: Da wir eine Fußgängerroute berechnen, zeigen wir dem Nutzer auch eventuell vorhandene Warnungen in einem separaten <div>-Bereich an.

var map;
var directionsRenderer;
var directionsService;
var stepDisplay;
var markerArray = [];

function initMap() {
  // Instantiate a directions service.
  directionsService = new google.maps.DirectionsService();

  // Create a map and center it on Manhattan.
  var manhattan = new google.maps.LatLng(40.7711329, -73.9741874);
  var mapOptions = {
    zoom: 13,
    center: manhattan
  }
  map = new google.maps.Map(document.getElementById('map'), mapOptions);

  // Create a renderer for directions and bind it to the map.
  var rendererOptions = {
    map: map
  }
  directionsRenderer = new google.maps.DirectionsRenderer(rendererOptions)

  // Instantiate an info window to hold step text.
  stepDisplay = new google.maps.InfoWindow();
}

function calcRoute() {

  // First, clear out any existing markerArray
  // from previous calculations.
  for (i = 0; i < markerArray.length; i++) {
    markerArray[i].setMap(null);
  }

  // Retrieve the start and end locations and create
  // a DirectionsRequest using WALKING directions.
  var start = document.getElementById('start').value;
  var end = document.getElementById('end').value;
  var request = {
      origin: start,
      destination: end,
      travelMode: 'WALKING'
  };

  // Route the directions and pass the response to a
  // function to create markers for each step.
  directionsService.route(request, function(response, status) {
    if (status == "OK") {
      var warnings = document.getElementById("warnings_panel");
      warnings.innerHTML = "" + response.routes[0].warnings + "";
      directionsRenderer.setDirections(response);
      showSteps(response);
    }
  });
}

function showSteps(directionResult) {
  // For each step, place a marker, and add the text to the marker's
  // info window. Also attach the marker to an array so we
  // can keep track of it and remove it when calculating new
  // routes.
  var myRoute = directionResult.routes[0].legs[0];

  for (var i = 0; i < myRoute.steps.length; i++) {
      var marker = new google.maps.Marker({
        position: myRoute.steps[i].start_point,
        map: map
      });
      attachInstructionText(marker, myRoute.steps[i].instructions);
      markerArray[i] = marker;
  }
}

function attachInstructionText(marker, text) {
  google.maps.event.addListener(marker, 'click', function() {
    stepDisplay.setContent(text);
    stepDisplay.open(map, marker);
  });
}

Im HTML-Textkörper:

<div>
<strong>Start: </strong>
<select id="start">
  <option value="penn station, new york, ny">Penn Station</option>
  <option value="grand central station, new york, ny">Grand Central Station</option>
  <option value="625 8th Avenue New York NY 10018">Port Authority Bus Terminal</option>
  <option value="staten island ferry terminal, new york, ny">Staten Island Ferry Terminal</option>
  <option value="101 E 125th Street, New York, NY">Harlem - 125th St Station</option>
</select>
<strong>End: </strong>
<select id="end" onchange="calcRoute();">
  <option value="260 Broadway New York NY 10007">City Hall</option>
  <option value="W 49th St & 5th Ave, New York, NY 10020">Rockefeller Center</option>
  <option value="moma, New York, NY">MOMA</option>
  <option value="350 5th Ave, New York, NY, 10118">Empire State Building</option>
  <option value="253 West 125th Street, New York, NY">Apollo Theatre</option>
  <option value="1 Wall St, New York, NY">Wall St</option>
</select>
<div>

Beispiel ansehen

Verwendung von Wegpunkten in Routen

Wie in DirectionsRequest erwähnt, können Sie beim Berechnen von Routen mit dem Routenplanerdienst für Fußgänger, Radfahrer oder Autofahrer auch Wegpunkte (vom Typ DirectionsWaypoint) angeben. Wegpunkte werden für Wegbeschreibungen für öffentliche Verkehrsmittel nicht unterstützt. Mit Wegpunkten können Sie Routen durch zusätzliche Standorte berechnen. In diesem Fall führt die zurückgegebene Route die angegebenen Wegpunkte durch.

Eine waypoint besteht aus folgenden Feldern:

  • location (erforderlich) gibt die Adresse des Wegpunkts an.
  • stopover (optional): Gibt an, ob dieser Wegpunkt ein tatsächlicher Halt auf der Route ist (true) oder stattdessen nur die Einstellung zum Weiterleiten durch den angegebenen Standort (false) beträgt. Aufenthalte sind standardmäßig true.

Standardmäßig wird vom Directions-Dienst eine Route über die angegebenen Wegpunkte in der angegebenen Reihenfolge berechnet. Optional können Sie optimizeWaypoints: true innerhalb von DirectionsRequest übergeben, damit der Routenplanerdienst die angegebene Route optimieren kann, indem die Wegpunkte in eine effizientere Reihenfolge gebracht werden. Diese Optimierung ist eine Anwendung des Problems des Reiseverkäufers. Die Fahrtzeit ist der primäre Faktor, der optimiert wird. Es werden jedoch auch andere Faktoren wie die Entfernung, die Anzahl der Abzweigungen und vieles mehr berücksichtigt, wenn es darum geht, welche Route am effizientesten ist. Alle Wegpunkte müssen Aufenthalte sein, damit der Directions-Dienst die Route optimieren kann.

Wenn Sie den Directions-Dienst anweisen, die Reihenfolge der Wegpunkte zu optimieren, wird die Reihenfolge im Feld waypoint_order im Objekt DirectionsResult zurückgegeben.

Im folgenden Beispiel werden Routen durch die USA mit verschiedenen Start-, Endpunkten und Wegpunkten berechnet. Falls Sie mehrere Wegpunkte auswählen möchten, drücken Sie Strg + Klick, während Sie Elemente in der Liste auswählen. Wir prüfen routes.start_address und routes.end_address, um uns den Text für den Start- und Endpunkt jeder Route zu liefern.

TypeScript

function initMap(): void {
  const directionsService = new google.maps.DirectionsService();
  const directionsRenderer = new google.maps.DirectionsRenderer();
  const map = new google.maps.Map(
    document.getElementById("map") as HTMLElement,
    {
      zoom: 6,
      center: { lat: 41.85, lng: -87.65 },
    }
  );

  directionsRenderer.setMap(map);

  (document.getElementById("submit") as HTMLElement).addEventListener(
    "click",
    () => {
      calculateAndDisplayRoute(directionsService, directionsRenderer);
    }
  );
}

function calculateAndDisplayRoute(
  directionsService: google.maps.DirectionsService,
  directionsRenderer: google.maps.DirectionsRenderer
) {
  const waypts: google.maps.DirectionsWaypoint[] = [];
  const checkboxArray = document.getElementById(
    "waypoints"
  ) as HTMLSelectElement;

  for (let i = 0; i < checkboxArray.length; i++) {
    if (checkboxArray.options[i].selected) {
      waypts.push({
        location: (checkboxArray[i] as HTMLOptionElement).value,
        stopover: true,
      });
    }
  }

  directionsService
    .route({
      origin: (document.getElementById("start") as HTMLInputElement).value,
      destination: (document.getElementById("end") as HTMLInputElement).value,
      waypoints: waypts,
      optimizeWaypoints: true,
      travelMode: google.maps.TravelMode.DRIVING,
    })
    .then((response) => {
      directionsRenderer.setDirections(response);

      const route = response.routes[0];
      const summaryPanel = document.getElementById(
        "directions-panel"
      ) as HTMLElement;

      summaryPanel.innerHTML = "";

      // For each route, display summary information.
      for (let i = 0; i < route.legs.length; i++) {
        const routeSegment = i + 1;

        summaryPanel.innerHTML +=
          "<b>Route Segment: " + routeSegment + "</b><br>";
        summaryPanel.innerHTML += route.legs[i].start_address + " to ";
        summaryPanel.innerHTML += route.legs[i].end_address + "<br>";
        summaryPanel.innerHTML += route.legs[i].distance!.text + "<br><br>";
      }
    })
    .catch((e) => window.alert("Directions request failed due to " + status));
}

declare global {
  interface Window {
    initMap: () => void;
  }
}
window.initMap = initMap;

JavaScript

function initMap() {
  const directionsService = new google.maps.DirectionsService();
  const directionsRenderer = new google.maps.DirectionsRenderer();
  const map = new google.maps.Map(document.getElementById("map"), {
    zoom: 6,
    center: { lat: 41.85, lng: -87.65 },
  });

  directionsRenderer.setMap(map);
  document.getElementById("submit").addEventListener("click", () => {
    calculateAndDisplayRoute(directionsService, directionsRenderer);
  });
}

function calculateAndDisplayRoute(directionsService, directionsRenderer) {
  const waypts = [];
  const checkboxArray = document.getElementById("waypoints");

  for (let i = 0; i < checkboxArray.length; i++) {
    if (checkboxArray.options[i].selected) {
      waypts.push({
        location: checkboxArray[i].value,
        stopover: true,
      });
    }
  }

  directionsService
    .route({
      origin: document.getElementById("start").value,
      destination: document.getElementById("end").value,
      waypoints: waypts,
      optimizeWaypoints: true,
      travelMode: google.maps.TravelMode.DRIVING,
    })
    .then((response) => {
      directionsRenderer.setDirections(response);

      const route = response.routes[0];
      const summaryPanel = document.getElementById("directions-panel");

      summaryPanel.innerHTML = "";

      // For each route, display summary information.
      for (let i = 0; i < route.legs.length; i++) {
        const routeSegment = i + 1;

        summaryPanel.innerHTML +=
          "<b>Route Segment: " + routeSegment + "</b><br>";
        summaryPanel.innerHTML += route.legs[i].start_address + " to ";
        summaryPanel.innerHTML += route.legs[i].end_address + "<br>";
        summaryPanel.innerHTML += route.legs[i].distance.text + "<br><br>";
      }
    })
    .catch((e) => window.alert("Directions request failed due to " + status));
}

window.initMap = initMap;

Einschränkungen für Wegpunkte

Es gelten die folgenden Nutzungsbeschränkungen und Einschränkungen:

  • Bei Verwendung des Directions-Diensts in der Maps JavaScript API sind maximal 25 Wegpunkte plus Ausgangs- und Zielort zulässig. Die Limits gelten für den Directions API-Webdienst.
  • Für den Directions API-Webdienst sind Kunden 25 Wegpunkte erlaubt, plus Ursprungsort und Zielort.
  • Für Nutzer der Google Maps Platform-Premiumoption sind 25 Wegpunkte plus Ausgangs- und Zielort zulässig.
  • Wegpunkte werden für Wegbeschreibungen für öffentliche Verkehrsmittel nicht unterstützt.

Ziehbare Wegbeschreibungen

Nutzer können die angezeigten Routen mithilfe von DirectionsRenderer dynamisch ändern, wenn sie kostenlos verschiebbar sind. Nutzer haben die Möglichkeit, Routen auszuwählen und zu ändern, indem sie auf die errechneten Routen auf der Karte klicken und sie verschieben. Sie legen fest, ob die Anzeige eines Renderers kostenlos verschiebbare Routen zulassen soll, indem Sie die Property draggable auf true setzen. Es ist nicht möglich, Wegbeschreibungen für öffentliche Verkehrsmittel als ziehbar zu definieren.

Wenn die Route dragbar ist, kann ein Nutzer einen beliebigen Punkt auf dem Pfad (oder einen Wegpunkt) des gerenderten Ergebnisses auswählen und die angegebene Komponente an einen neuen Ort verschieben. DirectionsRenderer wird dynamisch aktualisiert, um den geänderten Pfad anzuzeigen. Nach der Veröffentlichung wird der Karte ein Übergangspunkt hinzugefügt, der durch eine kleine weiße Markierung angezeigt wird. Wenn Sie ein Pfadsegment auswählen und verschieben, ändert sich der Abschnitt der Route. Wenn Sie eine Wegpunktmarkierung (einschließlich Start- und Endpunkt) auswählen und verschieben, ändern Sie damit auch die Streckenabschnitte dieser Route.

Da kostenlos verschiebbare Wegbeschreibungen clientseitig geändert und gerendert werden, kannst du das directions_changed-Ereignis für DirectionsRenderer beobachten und verarbeiten, sodass eine Benachrichtigung erfolgt, wenn der Nutzer die angezeigte Route geändert hat.

Der folgende Code zeigt eine Fahrt von Perth an der Westküste Australiens nach Sydney an der Ostküste. Der Code überwacht das Ereignis directions_changed, um die Gesamtstrecke aller Abschnitte der Reise zu aktualisieren.

TypeScript

function initMap(): void {
  const map = new google.maps.Map(
    document.getElementById("map") as HTMLElement,
    {
      zoom: 4,
      center: { lat: -24.345, lng: 134.46 }, // Australia.
    }
  );

  const directionsService = new google.maps.DirectionsService();
  const directionsRenderer = new google.maps.DirectionsRenderer({
    draggable: true,
    map,
    panel: document.getElementById("panel") as HTMLElement,
  });

  directionsRenderer.addListener("directions_changed", () => {
    const directions = directionsRenderer.getDirections();

    if (directions) {
      computeTotalDistance(directions);
    }
  });

  displayRoute(
    "Perth, WA",
    "Sydney, NSW",
    directionsService,
    directionsRenderer
  );
}

function displayRoute(
  origin: string,
  destination: string,
  service: google.maps.DirectionsService,
  display: google.maps.DirectionsRenderer
) {
  service
    .route({
      origin: origin,
      destination: destination,
      waypoints: [
        { location: "Adelaide, SA" },
        { location: "Broken Hill, NSW" },
      ],
      travelMode: google.maps.TravelMode.DRIVING,
      avoidTolls: true,
    })
    .then((result: google.maps.DirectionsResult) => {
      display.setDirections(result);
    })
    .catch((e) => {
      alert("Could not display directions due to: " + e);
    });
}

function computeTotalDistance(result: google.maps.DirectionsResult) {
  let total = 0;
  const myroute = result.routes[0];

  if (!myroute) {
    return;
  }

  for (let i = 0; i < myroute.legs.length; i++) {
    total += myroute.legs[i]!.distance!.value;
  }

  total = total / 1000;
  (document.getElementById("total") as HTMLElement).innerHTML = total + " km";
}

declare global {
  interface Window {
    initMap: () => void;
  }
}
window.initMap = initMap;

JavaScript

function initMap() {
  const map = new google.maps.Map(document.getElementById("map"), {
    zoom: 4,
    center: { lat: -24.345, lng: 134.46 }, // Australia.
  });
  const directionsService = new google.maps.DirectionsService();
  const directionsRenderer = new google.maps.DirectionsRenderer({
    draggable: true,
    map,
    panel: document.getElementById("panel"),
  });

  directionsRenderer.addListener("directions_changed", () => {
    const directions = directionsRenderer.getDirections();

    if (directions) {
      computeTotalDistance(directions);
    }
  });
  displayRoute(
    "Perth, WA",
    "Sydney, NSW",
    directionsService,
    directionsRenderer
  );
}

function displayRoute(origin, destination, service, display) {
  service
    .route({
      origin: origin,
      destination: destination,
      waypoints: [
        { location: "Adelaide, SA" },
        { location: "Broken Hill, NSW" },
      ],
      travelMode: google.maps.TravelMode.DRIVING,
      avoidTolls: true,
    })
    .then((result) => {
      display.setDirections(result);
    })
    .catch((e) => {
      alert("Could not display directions due to: " + e);
    });
}

function computeTotalDistance(result) {
  let total = 0;
  const myroute = result.routes[0];

  if (!myroute) {
    return;
  }

  for (let i = 0; i < myroute.legs.length; i++) {
    total += myroute.legs[i].distance.value;
  }

  total = total / 1000;
  document.getElementById("total").innerHTML = total + " km";
}

window.initMap = initMap;
Beispiel ansehen

Beispiel ausprobieren