distance-matrix-service

useDistanceMatrixService Hook Setup Example

This is an example setup to show the usage of the useDistanceMatrixService hook with the Google Maps React Hooks library.

Instructions

To run this project, clone the Google Maps React Hooks repository locally.

First go to the root of the repository and run:

npm install

once to install all dependencies.

Then start this example locally with

npm run start:distance-matrix-service-example

NOTE: To see the examples it is needed to add an .env file with a Google Maps API key in the following format:

GOOGLE_MAPS_API_KEY="<YOUR API KEY HERE>"

An example can be found in .env.example.

NOTE FOR WINDOWS USERS: We are using cross-env for environment variables to work on all platforms. There is an issue that npm uses cmd by default. The workaround is to add script-shell to powershell in your .npmrc. Please follow this setup to make it work.

Output

The project will start at localhost:1234 and show Google Map with a origin and different destinations. A side panel will show the different durations and distances to the destinations.