Google maps examples

There are few examples of work with google maps. Implemented examples for Markers, Markers cluster, Geocode, Autocomplete, Directions, Elevation, Layers, Panorama, Polygon, Polyline, GPX track features.

Install (locally)

1 . Clone repository:

git clone https://github.com/antonshell/google-maps-examples.git

2 . Install dependencies

composer install

3 . Set API KEY:

Create env file

nano .env.local

Set variable

GOOGLE_MAPS_API_KEY=YOUR_API_KEY

4 . Run built in web-server:

cd public
php -S 127.0.0.1:8000

5 . Open in browser:

http://127.0.0.1:8000/

Install (docker)

1 . Clone repository:

git clone https://github.com/antonshell/google-maps-examples.git

2 . Run docker compose:

cd google-maps-examples
docker-compose up -d

3 . Set API KEY:

Create env file

nano .env.local

Set variable

GOOGLE_MAPS_API_KEY=YOUR_API_KEY

3 . Open in browser:

http://127.0.0.1:18080/

Get API KEY

Create api key as described in the documentation: https://developers.google.com/maps/documentation/javascript/get-api-key

Here is more detailed unofficial tutorial: https://www.wpmapspro.com/docs/how-to-create-an-api-key/

There is list of enabled APIs:

Examples

Examples code can be found in templates/main directory

1 . Markers:

http://127.0.0.1:18080/markers

References:

Markers documentation

2 . Markers cluster

http://127.0.0.1:18080/clustering

References:

3 . Geocode

http://127.0.0.1:18080/geocode

References:

4 . Autocomplete

http://127.0.0.1:18080/autocomplete

References:

Places autocomplete

5 . Directions

http://127.0.0.1:18080/directions

References:

6 . Elevation

http://127.0.0.1:18080/elevation

References:

7 . Layers

http://127.0.0.1:18080/layers

References:

8 . Panorama

http://127.0.0.1:18080/panorama

References:

Simple example

9 . Polygon

http://127.0.0.1:18080/polygon

References:

10 . Polyline

http://127.0.0.1:18080/polyline

References:

11 . GPX track

http://127.0.0.1:18080/gpx

References: