Google Maps API — Google Maps Directions Service

Directions Service

The Directions Service is a client-side JavaScript library that lets us get directions data between two locations based on travel mode such as driving, walking, etc.

The Directions Service talks to Google Maps API behind the scene that takes direction requests such as origin, destination, travel mode and returns the efficient directions path data including multi-part directions.

Enable Directions API library

First, make sure that the Directions API library is enabled on the Google Cloud Console.

Include Maps JavaScript Library

Also, make sure to include the google maps client-side library in the project.

<script src="https://maps.googleapis.com/maps/api/js?key=[YOUR_API_KEY]">

Make A Request To Directions Service

Create an instance of the DirectionsService Object.

const directionsService = new google.maps.DirectionsService();

Call the route() method on the directionsService object to initiate a request to the Directions Service.

directionsService.route();

This method takes a couple of arguments which are DirectionsRequest and response callback function.

DirectionsRequest

DirectionsRequest will be a Javascript object which is where all the required query parameters are added as properties.

directionsService.route(
    {
            origin: "190 Main Street, Ottawa, Canada",
            destination: "290 First Avenue, Ottawa, Canada",
            travelMode: "DRIVING"
    }
)

Origin:

The value of the origin parameter can be one of 3 formats which are plain street address or geographic coordinates (latitude and longitude separated by a comma without any space in between) or the place_id.

This will be the starting point for calculating the directions between locations

For Example:
origin=123+Slater+Street+ON
origin=41.43206,-81.38992…