Migracja do klasy Route

Deweloperzy z Europejskiego Obszaru Gospodarczego (EOG)

Nowa biblioteka Routes Library w Maps JavaScript API zawiera klasę Route, która zastępuje starszą usługę wyznaczania trasy. Na tej stronie znajdziesz opis różnic między starszą usługą wyznaczania trasy a nową klasą Route oraz przykłady kodu do porównania.

Usługa Directions (starsza wersja) a klasa Route

Parametry żądania

W tabeli poniżej porównano parametry żądania w przypadku starszej wersji usługi Kierunki i klasy Route.

Usługa wyznaczania trasy (starsza wersja) Route
DirectionsService.route() metoda Route.computeRoutes() metoda

Wymagane parametry
origin origin
destination destination
travelMode travelMode (opcjonalnie)

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

Porównanie metod

W tabeli poniżej porównaliśmy najważniejsze metody starszej usługi Kierunki i klasy Route.

Usługa wyznaczania trasy (starsza wersja) Route
route() metoda computeRoutes() metoda
DirectionsRenderer.setDirections() metoda createPolylines() method, createWaypointAdvancedMarkers() method

Porównanie kodu

W tej sekcji porównujemy 2 podobne fragmenty kodu, aby zilustrować różnice między starszą usługą Kierunki a nową klasą Route. Fragmenty kodu pokazują kod wymagany w poszczególnych interfejsach API do wysłania żądania dotyczącego wskazówek dojazdu, a następnie używają wyniku do narysowania linii łamanej i znaczników na mapie.

W starszej wersji usługi Wskazówki dojazdu obiekt DirectionsRenderer służy do wyświetlania linii łamanych i znaczników reprezentujących wyniki wskazówek dojazdu na mapie. W bibliotece Routes obiekt DirectionsRenderer został zastąpiony metodami createPolylines() i createWaypointAdvancedMarkers(). Na tej stronie znajdziesz wyjaśnienie różnic między starszą wersją usługi Directions Service a nową klasą Route oraz przykładowy kod do porównania.

Pokaż trasę dojazdu

Usługa wyznaczania trasy (starsza wersja)

Poniższy kod pobiera wskazówki dojazdu za pomocą starszej usługi Directions, a następnie używa elementu DirectionsRenderer do narysowania linii łamanej i markerów na mapie: 

// 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.
  }
});

Klasa trasy

Poniższy kod pobiera wskazówki dojazdu za pomocą nowej klasy Route, a następnie używa metody createPolylines do narysowania linii łamanej na mapie i metody createWaypointAdvancedMarkers do narysowania na niej markerów.

Nowa klasa Route nie renderuje automatycznie znaczników. Aby renderować znaczniki, musisz wywołać funkcję createWaypointAdvancedMarkers.

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