Migrar para a classe Route

Desenvolvedores do Espaço Econômico Europeu (EEE)

A nova biblioteca Routes da API Maps JavaScript inclui a Route classe, que substitui o serviço Directions legado. Esta página explica as diferenças entre o serviço Directions legado e a nova Route classe e fornece alguns códigos para comparação.

Serviço Directions (legado) x classe Route

Parâmetros de solicitação

A tabela a seguir compara os parâmetros de solicitação do serviço Directions legado e da Route classe.

Serviço Directions (legado) Route
DirectionsService.route() método Route.computeRoutes() método

Parâmetros obrigatórios
origin origin
destination destination
travelMode travelMode (opcional)

Parâmetros opcionais
optimizeWaypoints optimizeWaypointOrder
provideRouteAlternatives computeAlternativeRoutes
avoidFerries, avoidHighways, avoidTolls routeModifiers
drivingOptions departureTime, trafficModel
region region
transitOptions transitPreference
arrivalTime arrivalTime
unitSystem units
waypoints intermediates

Comparação de métodos

A tabela a seguir compara os principais métodos do serviço Directions legado e da Route classe.

Serviço Directions (legado) Route
route() método Método computeRoutes()
DirectionsRenderer.setDirections() método Método createPolylines(), método createWaypointAdvancedMarkers()

Comparação de código

Esta seção compara dois trechos de código semelhantes para ilustrar as diferenças entre o serviço Directions legado e a nova Route classe. Os snippets de código mostram o código necessário em cada API para fazer uma solicitação de rota e, em seguida, usar o resultado para desenhar uma polilinha e marcadores no mapa.

No serviço Directions legado, o DirectionsRenderer objeto é usado para mostrar polilinhas e marcadores que representam os resultados de rotas em um mapa. Na biblioteca Routes, o DirectionsRenderer objeto foi substituído pelos createPolylines() e createWaypointAdvancedMarkers() métodos. Esta página explica as diferenças entre o serviço Directions legado e a nova Route classe e fornece alguns códigos para comparação.

Obter rotas de carro

Serviço Directions (legado)

O código a seguir recebe rotas de carro usando o serviço Directions legado e, em seguida, usa o DirectionsRenderer para desenhar uma polilinha e marcadores no mapa: 

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

Classe Route

O código a seguir recebe rotas de carro usando a nova classe Route e, em seguida, usa o método createPolylines para desenhar uma polilinha no mapa e o createWaypointAdvancedMarkers para desenhar marcadores no mapa.

A nova classe Route não renderiza marcadores automaticamente. É necessário chamar createWaypointAdvancedMarkers para renderizar marcadores.

TypeScript

// Define a routes request.
const request: google.maps.routes.ComputeRoutesRequest = {
    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 } = await Route.computeRoutes(request);

// Use createPolylines to create polylines for the route.
if (!routes) {
    console.warn('No routes found.');
    return;
}
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.map = map;
});

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 } = await Route.computeRoutes(request);

// Use createPolylines to create polylines for the route.
if (!routes) {
    console.warn('No routes found.');
    return;
}
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.map = map;
});