PHPackages                             goldfinch/google-maps - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. goldfinch/google-maps

ActiveSilverstripe-vendormodule

goldfinch/google-maps
=====================

The module helps to create and manage Google Maps in your Silverstripe project

v2.0.15(2y ago)06231[1 PRs](https://github.com/goldfinch/google-maps/pulls)1MITPHPPHP >=8.0

Since Jan 19Pushed 2y ago1 watchersCompare

[ Source](https://github.com/goldfinch/google-maps)[ Packagist](https://packagist.org/packages/goldfinch/google-maps)[ RSS](/packages/goldfinch-google-maps/feed)WikiDiscussions master Synced 1mo ago

READMEChangelogDependencies (10)Versions (37)Used By (1)

🦅 Google Maps for Silverstripe
==============================

[](#-google-maps-for-silverstripe)

[![Silverstripe Version](https://camo.githubusercontent.com/a798a57963ddebe0c33c27c757b7722fc95a0a6cc52f7c1839a90238934cafe4/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f53696c7665727374726970652d253545352e312d3030356165312e7376673f6c6162656c436f6c6f723d7768697465266c6f676f436f6c6f723d666666666666266c6f676f3d646174613a696d6167652f7376672b786d6c3b6261736536342c50484e325a79423462577875637a30696148523063446f764c336433647935334d793576636d63764d6a41774d43397a646d636949485a705a58644362336739496a41674d4341784d4445754d446b78494455344c6a55314e5349675a6d6c7362443069497a41774e57466c4d53496765473173626e4d36646a30696148523063484d364c7939325a574e30595335706279397559573576496a3438634746306143426b50534a4e4e5441754d444531494455754f445534624330794d5334794f444d674d5451754f5745324c6a55674e693431494441674d434177494463754e445134494445774c6a59314e4777794d5334794f444d744d5451754f574d344c6a67784d7930324c6a4533494449774c6a6b324c5451754d444934494449334c6a457a494451754e7a6732637a51754d444934494449774c6a6b324c5451754e7a6731494449334c6a457a624330324c6a59354d5341304c6a59334e6d4d314c6a55304d6941354c6a51784f4341784f4334774e7a67674e5334304e5455674d6a4d754e7a637a4c5451754e6a553051544d794c6a513349444d794c6a5133494441674d434177494455774c6a41784e5341314c6a67324d6e70744d5334774e5467674e4459754f444933624449784c6a49344e4330784e433435595459754e5341324c6a55674d434178494441744e7934304e446b744d5441754e6a557a5444517a4c6a59794d7941304d6934774d6a686a4c5467754f44457a494459754d5463744d6a41754f545535494451754d4449354c5449334c6a45794f5330304c6a63344e484d744e4334774d6a6b744d6a41754f545535494451754e7a67304c5449334c6a45794f5777324c6a59354d5330304c6a59334e6b4d794d6934304d79307a4c6a6b334e6941354c6a67354e4330754d44457a494451754d546b34494445774c6a41354e6d457a4d6934304e79417a4d6934304e794177494441674d4341304e6934344e7a55674e4449754e546b7965694976506a777663335a6e50673d3d)](https://packagist.org/packages/goldfinch/google-maps)[![Package Version](https://camo.githubusercontent.com/3f2323e008d26fd3aafc02cc62ea6b982d1853a4d1bafdeff51f3391b7dde55a/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f676f6c6466696e63682f676f6f676c652d6d6170732e7376673f6c6162656c436f6c6f723d33333326636f6c6f723d463843363330266c6162656c3d56657273696f6e)](https://packagist.org/packages/goldfinch/google-maps)[![Total Downloads](https://camo.githubusercontent.com/4ee7e65091f5e0aaf9469c44b696ef5b1fc5c3e5abaed6e33632e36ae80f3dfc/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f676f6c6466696e63682f676f6f676c652d6d6170732e7376673f6c6162656c436f6c6f723d33333326636f6c6f723d463843363330266c6162656c3d446f776e6c6f616473)](https://packagist.org/packages/goldfinch/google-maps)[![License](https://camo.githubusercontent.com/563f45f264a894f2a5184d3b422de0052a84abd38f14f2f3855cf265b0f18eff/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f6c2f676f6c6466696e63682f676f6f676c652d6d6170732e7376673f6c6162656c436f6c6f723d33333326636f6c6f723d463843363330266c6162656c3d4c6963656e7365)](https://packagist.org/packages/goldfinch/google-maps)

The module helps to create and manage **Google Maps** 🌏 in your Silverstripe project. It comes with comprehensive settings that you can use to your advantage. Whether you need to create simple or complex maps 🗺️, markers 📍 and more.

Install
-------

[](#install)

#### 1. Install module

[](#1-install-module)

```
composer require goldfinch/google-maps
```

#### 2. Create Google Cloud API key with the required libraries

[](#2-create-google-cloud-api-key-with-the-required-libraries)

There are two **API Libraries** that need to be enabled for the proper work of this module.

- [Maps JavaScript API](https://console.cloud.google.com/apis/library/maps-backend.googleapis.com) for maps integration
- [Maps Static API](https://console.cloud.google.com/apis/library/static-maps-backend.googleapis.com) for maps thumbnails and previews

#### 3. Add Google Cloud API key to your **.env**

[](#3-add-google-cloud-api-key-to-your-env)

```
APP_GOOGLE_MAPS_KEY=""
```

#### 4. Implement JavaScript front-end component

[](#4-implement-javascript-front-end-component)

*via Silverstripe Requirements PHP*

```
Requirements::javascript('goldfinch/google-maps:client/dist/map.js');
```

*via template require*

```

```

*via ES6 module*

```
npm i @googlemaps/js-api-loader
```

```
import GoogleMap from '..../vendor/goldfinch/google-maps/client/src/src/map-mod'

// import GoogleMap from '@goldfinch/google-maps/src/map-mod'; // with alias

document.addEventListener('DOMContentLoaded', () => {
  new GoogleMap()
})
```

```
// vite.config.js
// * only if you use alias import above

import { defineConfig } from 'vite'

export default defineConfig(({ command, mode }) => {
  return {
    // ..

    resolve: {
      alias: [{ find: '@goldfinch', replacement: fileURLToPath(new URL('./vendor/goldfinch', import.meta.url)) }]
    }

    // ..
  }
})
```

Available Taz commands
----------------------

[](#available-taz-commands)

If you haven't used [**Taz**](https://github.com/goldfinch/taz)🌪️ before, *taz* file must be presented in your root project folder `cp vendor/goldfinch/taz/taz taz`

---

> Create map segment

```
php taz make:map-segment
```

> Create InfoWindow template

```
php taz make:map-infowindow:template
```

> Create MapBlock extension

```
php taz vendor:google-maps:ext:block
```

> Create Config extension

```
php taz vendor:google-maps:ext:config
```

> Create MapsAdmin extension

```
php taz vendor:google-maps:ext:admin
```

> Create MapSegment extension

```
php taz vendor:google-maps:ext:segment
```

> Create full Yaml config (further config amends are required, you might want to remove what you don't need)

```
php taz vendor:google-maps:config
```

> Publish all available templates

```
php taz vendor:google-maps:templates
```

> Runs a bundle of all available `vendor:google-maps:*` commands

```
php taz vendor:google-maps
```

How to create a new map
-----------------------

[](#how-to-create-a-new-map)

Each **Google Map** is built on what is called **Map Segment**.

#### 1. Create a map segment

[](#1-create-a-map-segment)

Use [**Taz**](https://github.com/goldfinch/taz)🌪️ to generate new Map Segment. It will quickly lead you through the setup and take care of it for you.

```
php taz make:map-segment
```

#### 2. Create map record in CMS

[](#2-create-map-record-in-cms)

Go to `/admin/maps` and add new map. In the **Type** we need to select our map segment that has been created the step before (should be selected by default). You can go ahead, add markers and check out the *Settings* tab if you want.

#### 3. Custom Info Window template (optional)

[](#3-custom-info-window-template-optional)

This module comes with various settings for Maps and Markers. You can also add Info Window for markers and easily customize it for your needs. All you need to do is create your custom InfoWindow template by using **Taz**

```
php taz make:map-infowindow:template
```

Once it's been created, you can go to any marker record you added to your map and select your custom template in **Info Window Template** dropdown.

Usage
-----

[](#usage)

#### Across templates

[](#across-templates)

Using **GoogleMaps** global provider.

> Render map segment template by type

```
$GoogleMaps.bySegment(office).RenderSegmentMap
```

> Render map frame only by type

```
$GoogleMaps.bySegment(office).MapElement
```

> Render map segment template by ID

```
$GoogleMaps.byID(1).RenderSegmentMap
```

> Render map frame only by ID

```
$GoogleMaps.byID(1).MapElement
```

#### Using elemental block

[](#using-elemental-block)

If you prefer using [silverstripe/silverstripe-elemental](https://github.com/silverstripe/silverstripe-elemental), you can take a look at **Map** block that already comes with this module.

Sidenotes
---------

[](#sidenotes)

*Google Maps* iframes might have a blue border that you want to get rid of.

```
.gm-style iframe + div {
  border: none !important;
}
```

*As of February 21st, 2024, Marker is deprecated. Please use AdvancedMarkerElement instead.*

Events
------

[](#events)

- [Map events](https://developers.google.com/maps/documentation/javascript/events)
- [Marker events](https://developers.google.com/maps/documentation/javascript/reference/marker#Marker-Events)
- [AdvancedMarkerElement events](https://developers.google.com/maps/documentation/javascript/reference/advanced-markers#AdvancedMarkerElement-Events)
- [Info Window events](https://developers.google.com/maps/documentation/javascript/reference/info-window#InfoWindow-Events)

Available JavaScript callback events

```
window.goldfinch = {}

window.goldfinch.map_callback = (map, mapSettings, segment, parameters) => {
  // ..
}
window.goldfinch.marker_callback = (marker, markerParams, e, map, segment, parameters) => {
  // ..
}
window.goldfinch.infoWindow_callback = (infoWindow, infowindowParams, marker, map, e, segment, parameters) => {
  // ..
}
```

Previews
--------

[](#previews)

#### Admin

[](#admin)

[![Map admin](screenshots/map-admin.png)](screenshots/map-admin.png)

#### Map segment

[](#map-segment)

[![Map segment](screenshots/map-segment.png)](screenshots/map-segment.png)

#### Map segment settings

[](#map-segment-settings)

[![Map segment settings](screenshots/map-settings.png)](screenshots/map-settings.png)

#### Map's markers

[](#maps-markers)

[![Map markers](screenshots/map-markers.png)](screenshots/map-markers.png)

#### Marker item

[](#marker-item)

[![Marker item](screenshots/marker-item.png)](screenshots/marker-item.png)

#### Marker settings

[](#marker-settings)

[![Marker settings](screenshots/marker-settings.png)](screenshots/marker-settings.png)

License
-------

[](#license)

The MIT License (MIT)

###  Health Score

28

↓

LowBetter than 54% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity14

Limited adoption so far

Community10

Small or concentrated contributor base

Maturity58

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~3 days

Total

36

Last Release

730d ago

Major Versions

v1.0.19 → v2.0.02024-03-07

### Community

Maintainers

![](https://avatars.githubusercontent.com/u/2291826?v=4)[goldfinch](/maintainers/goldfinch)[@goldfinch](https://github.com/goldfinch)

---

Top Contributors

[![goldfinch](https://avatars.githubusercontent.com/u/2291826?v=4)](https://github.com/goldfinch "goldfinch (78 commits)")

---

Tags

silverstripegoogle mapssilverstripe-google-mapsmap-eventsmarker-eventsadvancedmarkerelement-eventsinfo-window-events

### Embed Badge

![Health badge](/badges/goldfinch-google-maps/health.svg)

```
[![Health](https://phpackages.com/badges/goldfinch-google-maps/health.svg)](https://phpackages.com/packages/goldfinch-google-maps)
```

###  Alternatives

[silverstripe/cms

The SilverStripe Content Management System

5163.4M1.3k](/packages/silverstripe-cms)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)