Introducing Places UI Kit: A ready-to-use, low-cost component library that lets you bring the familiar Google Maps UI for Places to any map of your choice. Try it out, and share your input to help shape the future of GMP!

Directions

DirectionsService class

google.maps.DirectionsService class

A service for computing directions between two or more places.

Access by calling const {DirectionsService} = await google.maps.importLibrary("routes").
See Libraries in the Maps JavaScript API.

Constructor
`DirectionsService`	`DirectionsService()` Parameters: None Creates a new instance of a `DirectionsService` that sends directions queries to Google servers.

Methods
`route`	`route(request[, callback])` Parameters: `request`: `DirectionsRequest` `callback`: `function(DirectionsResult optional, DirectionsStatus): void optional` Return Value: `Promise<DirectionsResult>` Issue a directions search request.

DirectionsRequest interface

google.maps.DirectionsRequest interface

A directions query to be sent to the DirectionsService.

Properties
`destination`	Type: `string\|LatLng\|Place\|LatLngLiteral` Location of destination. This can be specified as either a string to be geocoded, or a `LatLng`, or a `Place`. Required.
`origin`	Type: `string\|LatLng\|Place\|LatLngLiteral` Location of origin. This can be specified as either a string to be geocoded, or a `LatLng`, or a `Place`. Required.
`travelMode`	Type: `TravelMode` Type of routing requested. Required.
`avoidFerries optional`	Type: `boolean optional` If `true`, instructs the Directions service to avoid ferries where possible. Optional.
`avoidHighways optional`	Type: `boolean optional` If `true`, instructs the Directions service to avoid highways where possible. Optional.
`avoidTolls optional`	Type: `boolean optional` If `true`, instructs the Directions service to avoid toll roads where possible. Optional.
`drivingOptions optional`	Type: `DrivingOptions optional` Settings that apply only to requests where `travelMode` is `DRIVING`. This object will have no effect for other travel modes.
`language optional`	Type: `string optional` A language identifier for the language in which results should be returned, when possible. See the list of supported languages.
`optimizeWaypoints optional`	Type: `boolean optional` If set to `true`, the `DirectionsService` will attempt to re-order the supplied intermediate waypoints to minimize overall cost of the route. If waypoints are optimized, inspect `DirectionsRoute.waypoint_order` in the response to determine the new ordering.
`provideRouteAlternatives optional`	Type: `boolean optional` Whether or not route alternatives should be provided. Optional.
`region optional`	Type: `string optional` Region code used as a bias for geocoding requests. The region code accepts a ccTLD ("top-level domain") two-character value. Most ccTLD codes are identical to ISO 3166-1 codes, with some notable exceptions. For example, the United Kingdom's ccTLD is "uk" (`.co.uk`) while its ISO 3166-1 code is "gb" (technically for the entity of "The United Kingdom of Great Britain and Northern Ireland").
`transitOptions optional`	Type: `TransitOptions optional` Settings that apply only to requests where `travelMode` is TRANSIT. This object will have no effect for other travel modes.
`unitSystem optional`	Type: `UnitSystem optional` Default: The unit system used in the country of origin. Preferred unit system to use when displaying distance.
`waypoints optional`	Type: `Array<DirectionsWaypoint> optional` Array of intermediate waypoints. Directions are calculated from the origin to the destination by way of each waypoint in this array. See the developer's guide for the maximum number of waypoints allowed. Waypoints are not supported for transit directions. Optional.

DirectionsStatus constants

google.maps.DirectionsStatus constants

The status returned by the DirectionsService on the completion of a call to route(). Specify these by value, or by using the constant's name. For example, 'OK' or google.maps.DirectionsStatus.OK.

Access by calling const {DirectionsStatus} = await google.maps.importLibrary("routes").
See Libraries in the Maps JavaScript API.

Constants
`INVALID_REQUEST`	The `DirectionsRequest` provided was invalid.
`MAX_WAYPOINTS_EXCEEDED`	Too many `DirectionsWaypoint`s were provided in the `DirectionsRequest`. See the developer's guide for the maximum number of waypoints allowed.
`NOT_FOUND`	At least one of the origin, destination, or waypoints could not be geocoded.
`OK`	The response contains a valid `DirectionsResult`.
`OVER_QUERY_LIMIT`	The webpage has gone over the requests limit in too short a period of time.
`REQUEST_DENIED`	The webpage is not allowed to use the directions service.
`UNKNOWN_ERROR`	A directions request could not be processed due to a server error. The request may succeed if you try again.
`ZERO_RESULTS`	No route could be found between the origin and destination.

DirectionsResult interface

google.maps.DirectionsResult interface

The directions response retrieved from the directions server. You can render these using a DirectionsRenderer or parse this object and render it yourself. You must display the warnings and copyrights as noted in the Google Maps Platform Terms of Service. Note that though this result is "JSON-like," it is not strictly JSON, as it indirectly includes LatLng objects.

Properties
`request`	Type: `DirectionsRequest` The DirectionsRequest that yielded this result.
`routes`	Type: `Array<DirectionsRoute>` An array of `DirectionsRoute`s, each of which contains information about the legs and steps of which it is composed. There will only be one route unless the `DirectionsRequest` was made with `provideRouteAlternatives` set to `true`.
`available_travel_modes optional`	Type: `Array<TravelMode> optional` Contains an array of available travel modes. This field is returned when a request specifies a travel mode and gets no results. The array contains the available travel modes in the countries of the given set of waypoints. This field is not returned if one or more of the waypoints are 'via waypoints'.
`geocoded_waypoints optional`	Type: `Array<DirectionsGeocodedWaypoint> optional` An array of `DirectionsGeocodedWaypoint`s, each of which contains information about the geocoding of origin, destination and waypoints.

DirectionsRenderer class

google.maps.DirectionsRenderer class

Renders directions obtained from the DirectionsService.

This class extends MVCObject.

Access by calling const {DirectionsRenderer} = await google.maps.importLibrary("routes").
See Libraries in the Maps JavaScript API.

Constructor
`DirectionsRenderer`	`DirectionsRenderer([opts])` Parameters: `opts`: `DirectionsRendererOptions optional` Creates the renderer with the given options. Directions can be rendered on a map (as visual overlays) or additionally on a `<div>` panel (as textual instructions).

Methods
`getDirections`	`getDirections()` Parameters: None Return Value: `DirectionsResult` Returns the renderer's current set of directions.
`getMap`	`getMap()` Parameters: None Return Value: `Map` Returns the map on which the `DirectionsResult` is rendered.
`getPanel`	`getPanel()` Parameters: None Return Value: `HTMLElement\|null` Returns the panel `<div>` in which the `DirectionsResult` is rendered.
`getRouteIndex`	`getRouteIndex()` Parameters: None Return Value: `number` Returns the current (zero-based) route index in use by this `DirectionsRenderer` object.
`setDirections`	`setDirections(directions)` Parameters: `directions`: `DirectionsResult` Return Value: None Set the renderer to use the result from the `DirectionsService`. Setting a valid set of directions in this manner will display the directions on the renderer's designated map and panel.
`setMap`	`setMap(map)` Parameters: `map`: `Map` Return Value: None This method specifies the map on which directions will be rendered. Pass `null` to remove the directions from the map.
`setOptions`	`setOptions(options)` Parameters: `options`: `DirectionsRendererOptions` Return Value: None Change the options settings of this `DirectionsRenderer` after initialization.
`setPanel`	`setPanel(panel)` Parameters: `panel`: `HTMLElement optional` Return Value: None This method renders the directions in a `<div>`. Pass `null` to remove the content from the panel.
`setRouteIndex`	`setRouteIndex(routeIndex)` Parameters: `routeIndex`: `number` Return Value: None Set the (zero-based) index of the route in the `DirectionsResult` object to render. By default, the first route in the array will be rendered.
Inherited:

Directions Stay organized with collections Save and categorize content based on your preferences.

DirectionsService class

Constructor

Methods