**European Economic Area (EEA) developers**

> [!NOTE]
> If your billing address is in the European Economic Area, effective on 8 July 2025, the [Google Maps Platform EEA Terms of Service](https://cloud.google.com/terms/maps-platform/eea) will apply to your use of the Services. Functionality varies by region. [Learn more](https://developers.google.com/maps/comms/eea/faq.md.txt).

The new Routes Library, Maps JavaScript API includes the `Route` class, which replaces the
[legacy Directions Service](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt). This
page explains the differences between the legacy directions service and the new `Route`
class, and provides some code for comparison.

## Directions service (Legacy) versus Route class

### Request parameters

The following table compares the request parameters for the legacy Directions service and the
`Route` class.

| [Directions Service (Legacy)](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt) | [`Route`](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt) |
|---|---|
| [`DirectionsService.route()` method](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt#DirectionsRequests) | [`Route.computeRoutes()` method](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt#Route.computeRoutes) |
| **Required Parameters** ||
| [`origin`](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt#DirectionsRequests) | [`origin`](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt#ComputeRoutesRequest.origin) |
| [`destination`](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt#DirectionsRequests) | [`destination`](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt#ComputeRoutesRequest.destination) |
| [`travelMode`](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt#TravelModes) | [`travelMode` (optional)](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt#ComputeRoutesRequest.travelMode) |
| **Optional Parameters** ||
| [`optimizeWaypoints`](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt#DirectionsRequests) | [`optimizeWaypointOrder`](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt#ComputeRoutesRequest.optimizeWaypointOrder) |
| [`provideRouteAlternatives`](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt#DirectionsRequests) | [`computeAlternativeRoutes`](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt#ComputeRoutesRequest.computeAlternativeRoutes) |
| [`avoidFerries`, `avoidHighways`, `avoidTolls`](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt#DirectionsRequests) | [`routeModifiers`](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt#ComputeRoutesRequest.routeModifiers) |
| [`drivingOptions`](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt#DrivingOptions) | [`departureTime`](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt#ComputeRoutesRequest.departureTime), [`trafficModel`](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt#ComputeRoutesRequest.traffic_model) |
| [`region`](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt#DirectionsRequests) | [`region`](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt#ComputeRoutesRequest.region) |
| [`transitOptions`](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt#TransitOptions) | [`transitPreference`](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt#ComputeRoutesRequest.transitPreference) |
| [`arrivalTime`](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt) | [`arrivalTime`](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt#ComputeRoutesRequest.arrivalTime) |
| [`unitSystem`](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt#UnitSystems) | [`units`](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt#ComputeRoutesRequest.units) |
| [`waypoints`](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt#DirectionsRequests) | [`intermediates`](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt#ComputeRoutesRequest.intermediates) |

### Methods comparison

The following table compares key methods for the legacy Directions service and the
`Route` class.

| [Directions Service (Legacy)](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt) | [`Route`](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt) |
|---|---|
| [`route()` method](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt#RenderingDirections) | [`computeRoutes()` method](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt#Route.computeRoutes) |
| [`DirectionsRenderer.setDirections()` method](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt#DisplayingResults) | [`createPolylines()` method](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt#Route.createPolylines), [`createWaypointAdvancedMarkers()` method](https://developers.google.com/maps/documentation/javascript/reference/route.md.txt#Route.createWaypointAdvancedMarkers) |

## Code comparison

This section compares two similar pieces of code to illustrate the differences between the
legacy Directions service and the new `Route` class. The code snippets show the code
required on each respective API to make a directions request, and then use the result to draw a
polyline and markers on the map.

In the legacy Directions service, the
[`DirectionsRenderer`](https://developers.google.com/maps/documentation/javascript/legacy/directions.md.txt#DisplayingResults)
object is used to display polylines and markers to represent directions results on a map. In
the Routes library, the `DirectionsRenderer` object has been
replaced by the `createPolylines()` and `createWaypointAdvancedMarkers()`
methods. This page explains the differences between the legacy Directions Service and the new
`Route` class, and provides some code for comparison.

### Get driving directions

#### Directions service (Legacy)


The following code gets driving directions using the legacy Directions service, and then uses
the `DirectionsRenderer` to draw a polyline and markers on the map:

```javascript
// 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.
  }
});
```
**Important:** The legacy `DirectionsRenderer` object uses the legacy [Marker class](https://developers.google.com/maps/documentation/javascript/reference.md.txt#marker), which is deprecated.

#### Route class

The following code gets driving directions using the new Route class, then
uses the `createPolylines` method to draw a polyline on the map, and the
`createWaypointAdvancedMarkers` method to draw markers on the map.

The new `Route` class does not automatically render markers. You must call
`createWaypointAdvancedMarkers` to render markers.

### TypeScript

```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

```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;
});
```
**Important:** The [Advanced Marker class](https://developers.google.com/maps/documentation/javascript/reference/advanced-markers.md.txt) Requires a map ID to be set in map options. If you don't have a custom map ID, you can use `DEMO_MAP_ID`. [Learn more](https://developers.google.com/maps/documentation/javascript/map-ids/mapid-over.md.txt).