> For the complete documentation index, see [llms.txt](https://sygnal.gitbook.io/sygnal-webflow-components/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://sygnal.gitbook.io/sygnal-webflow-components/cc/sygnal-maps/google-map-simple.md).

# Google Map ( Simple ) ✅

<figure><img src="/files/HAULWFpTkfUTviFIr0qa" alt=""><figcaption></figcaption></figure>

## Key Features

* No Google Maps API key required
* Easy location-based mapping
  * CMS binding support to a text location field
* Multiple map types: Street Map, Satellite, Hybrid, Terrain
* Configurable zoom levels&#x20;
* Flexible sizing options&#x20;

## Demo

{% embed url="<https://webflow-core-component-test.webflow.io/google-maps>" %}

## Properties&#x20;

| Name     | Type             | Notes                                                                                                                                                                                                            |
| -------- | ---------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Type     | Variant          | Choose from Street Map, Satellite, Hybrid, or Terrain views                                                                                                                                                      |
| Location | Text             | Address, place name, or coordinates (e.g., "Eiffel Tower,Paris" or "48.8584,2.2945")                                                                                                                             |
| Zoom     | Number           | <p>Zoom level from 1-20:</p><ul><li>1: World view</li><li>5: Continent / subcontinental view</li><li>10: City view</li><li>15: Streets view</li><li>16-17: Buildings view</li><li>20: Building details</li></ul> |
| Width    | Text ( Measure ) | CSS measurements (e.g., "100%", "300px", "50vw"). Height defaults to `500px` if not specified.                                                                                                                   |
| Height   | Text ( Measure ) | CSS measurements (e.g., "100%", "300px", "50vw"). Height defaults to `500px` if not specified.                                                                                                                   |
| Debug    | Boolean          | For console log debugging                                                                                                                                                                                        |

## Best Practices&#x20;

Recommended zoom levels:

* Business/POI: 15-16
* Neighborhood: 14-15
* City overview: 12-13
* Regional: 8-10
* Country: 5-6
* Continent: 4-5

## Styling&#x20;

None.&#x20;