Zur Route-Klasse migrieren

Entwickler im Europäischen Wirtschaftsraum (EWR)

Die neue Routes Library der Maps JavaScript API enthält die Klasse Route, die den alten Directions-Dienst ersetzt. Auf dieser Seite werden die Unterschiede zwischen dem alten Directions-Dienst und der neuen Route-Klasse erläutert. Außerdem finden Sie hier Vergleichscode.

„Directions“-Dienst (Legacy) im Vergleich zur Route-Klasse

Anfrageparameter

In der folgenden Tabelle werden die Anfrageparameter für den alten Directions-Dienst und die Klasse Route verglichen.

„Directions“-Dienst (Legacy) Route
DirectionsService.route()-Methode Route.computeRoutes()-Methode

Erforderliche Parameter
origin origin
destination destination
travelMode travelMode (optional)

Optionale Parameter
optimizeWaypoints optimizeWaypointOrder
provideRouteAlternatives computeAlternativeRoutes
avoidFerries, avoidHighways, avoidTolls routeModifiers
drivingOptions departureTime, trafficModel
region region
transitOptions transitPreference
arrivalTime arrivalTime
unitSystem units
waypoints intermediates

Methodenvergleich

In der folgenden Tabelle werden die wichtigsten Methoden für den alten Directions-Dienst und die Klasse Route verglichen.

„Directions“-Dienst (Legacy) Route
route()-Methode computeRoutes()-Methode
DirectionsRenderer.setDirections()-Methode createPolylines()-Methode, createWaypointAdvancedMarkers()-Methode

Codevergleich

In diesem Abschnitt werden zwei ähnliche Codeabschnitte verglichen, um die Unterschiede zwischen dem alten Directions-Dienst und der neuen Klasse Route zu veranschaulichen. Die Code-Snippets zeigen den Code, der für die jeweilige API erforderlich ist, um eine Routenanfrage zu stellen und dann das Ergebnis zu verwenden, um eine Polylinie und Markierungen auf der Karte zu zeichnen.

Im alten Directions-Dienst wird das Objekt DirectionsRenderer verwendet, um Polylinien und Markierungen zur Darstellung von Ergebnissen für Wegbeschreibungen auf einer Karte anzuzeigen. In der Routes-Bibliothek wurde das DirectionsRenderer-Objekt durch die Methoden createPolylines() und createWaypointAdvancedMarkers() ersetzt. Auf dieser Seite werden die Unterschiede zwischen dem alten Directions Service und der neuen Klasse Route erläutert. Außerdem finden Sie hier Vergleichscode.

Route berechnen

„Directions“-Dienst (Legacy)

Im folgenden Code werden mithilfe des alten Directions-Dienstes eine Wegbeschreibung abgerufen und dann mit DirectionsRenderer eine Polylinie und Markierungen auf der Karte gezeichnet: 

// Define a simple request.
var request = {
  origin: 'Mountain View, CA',
  destination: 'San Francisco, CA',
  travelMode: 'DRIVING'
};
// Call the Directions Service to get the directions.
directionsService.route(request, function(result, status) {
  if (status == 'OK') {
    directionsRenderer.setDirections(result); // Add polyline and markers to the map.
  }
});

Routenklasse

Im folgenden Code werden mithilfe der neuen Route-Klasse eine Wegbeschreibung abgerufen. Anschließend wird mit der Methode createPolylines eine Polylinie auf der Karte gezeichnet und mit der Methode createWaypointAdvancedMarkers Markierungen auf der Karte gezeichnet.

In der neuen Route-Klasse werden Markierungen nicht automatisch gerendert. Sie müssen createWaypointAdvancedMarkers aufrufen, um Markierungen zu rendern.

TypeScript

// Define a routes request.
const request = {
  origin: 'Mountain View, CA',
  destination: 'San Francisco, CA',
  travelMode: 'DRIVING',
  fields: ['path'], // Request fields needed to draw polylines.
};

// Call computeRoutes to get the directions.
const {routes, fallbackInfo, geocodingResults} = await Route.computeRoutes(request);

// Use createPolylines to create polylines for the route.
mapPolylines = routes[0].createPolylines();
// Add polylines to the map.
mapPolylines.forEach((polyline) => polyline.setMap(map));

// Create markers to start and end points.
const markers = await routes[0].createWaypointAdvancedMarkers();
// Add markers to the map
markers.forEach((marker) => marker.setMap(map));
index.ts

JavaScript

// Define a routes request.
const request = {
    origin: 'Mountain View, CA',
    destination: 'San Francisco, CA',
    travelMode: 'DRIVING',
    fields: ['path'], // Request fields needed to draw polylines.
};
// Call computeRoutes to get the directions.
const { routes, fallbackInfo, geocodingResults } = await Route.computeRoutes(request);
// Use createPolylines to create polylines for the route.
mapPolylines = routes[0].createPolylines();
// Add polylines to the map.
mapPolylines.forEach((polyline) => polyline.setMap(map));
// Create markers to start and end points.
const markers = await routes[0].createWaypointAdvancedMarkers();
// Add markers to the map
markers.forEach((marker) => marker.setMap(map));
index.js