# Map

***

## Tutorials

### Getting Started

<table data-view="cards"><thead><tr><th></th><th></th><th></th><th data-hidden data-card-cover data-type="files"></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td><strong>Building a dynamic map component</strong></td><td></td><td></td><td><a href="/files/0L7eteXdAe3SnIzwxhnK">/files/0L7eteXdAe3SnIzwxhnK</a></td><td><a href="/spaces/dHOej9Pd5IxJNGEJMZKW/pages/ycDXF0y2Fj6NpL8x9es3">/spaces/dHOej9Pd5IxJNGEJMZKW/pages/ycDXF0y2Fj6NpL8x9es3</a></td></tr><tr><td><strong>Building a map with instant account insights</strong></td><td></td><td></td><td><a href="/files/2QIcb8JRmKn6hlhQy9MJ">/files/2QIcb8JRmKn6hlhQy9MJ</a></td><td><a href="/spaces/dHOej9Pd5IxJNGEJMZKW/pages/jK2xfO1WUsBVjK7AbcFZ">/spaces/dHOej9Pd5IxJNGEJMZKW/pages/jK2xfO1WUsBVjK7AbcFZ</a></td></tr><tr><td><strong>Building a "No-Code" Salesforce Map for Instant Account Insights [VIDEO]</strong></td><td></td><td></td><td><a href="/files/tUlqZvVIlivnacfznmwn">/files/tUlqZvVIlivnacfznmwn</a></td><td><a href="https://youtu.be/4JgAJE3if-0">https://youtu.be/4JgAJE3if-0</a></td></tr></tbody></table>

### Customization

<table data-card-size="large" data-view="cards"><thead><tr><th></th><th></th><th></th><th data-hidden data-card-cover data-type="files"></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td><strong>Customize the Map Marker</strong></td><td></td><td></td><td><a href="/files/UtwMSGWW7tp8e8nCb0Ns">/files/UtwMSGWW7tp8e8nCb0Ns</a></td><td><a href="/pages/cL2pAFYtsL60RKrhISDb">/pages/cL2pAFYtsL60RKrhISDb</a></td></tr><tr><td><strong>How to customize the Map Marker (Video)</strong></td><td></td><td></td><td><a href="/files/UtwMSGWW7tp8e8nCb0Ns">/files/UtwMSGWW7tp8e8nCb0Ns</a></td><td><a href="https://youtu.be/aXr176E4vKs">https://youtu.be/aXr176E4vKs</a></td></tr></tbody></table>

***

## Step 1 — Choose Your Map Type

This is the most important decision. Everything else depends on it.

|                          | Google Maps                | Leaflet Maps                    |
| ------------------------ | -------------------------- | ------------------------------- |
| **Best for**             | Simple, address-based maps | Data-heavy or interactive maps  |
| **Marker limit**         | 100 markers                | Unlimited                       |
| **Location input**       | Street address             | Latitude + Longitude (required) |
| **Marker clustering**    | ❌                          | ✅                               |
| **Draw shapes on map**   | ❌                          | ✅                               |
| **GeoJSON territories**  | ❌                          | ✅                               |
| **Airbnb-style refresh** | ❌                          | ✅                               |

### Google Maps — Use When...

You have street addresses and fewer than 100 locations to show. No extra data prep needed — paste in `123 Main St, New York` and it just works.

> **Example:** A "Contact Us" page showing your 5 regional offices.

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

{% hint style="warning" %}
Please note that up to 100 markers can be displayed on the map simultaneously in Google Maps.
{% endhint %}

### Leaflet Maps — Use When...

You need to handle large datasets, draw custom shapes, or build something interactive. The trade-off: every location must have **latitude and longitude coordinates** — Leaflet cannot geocode a street address on its own.

> **Example:** A field sales rep opens a flow and sees all 800 accounts in their region, clustered by area. As they zoom into a city, individual pins appear. They draw a polygon around a new prospect area and save it to the record.

{% hint style="danger" %}

#### Important

Before using Leaflet, make sure your Salesforce records have latitude/longitude fields populated. If they don't, you'll need to geocode your addresses first.&#x20;
{% endhint %}

<figure><img src="/files/23OXqXpKSVjEwSsAEoss" alt=""><figcaption></figcaption></figure>

***

## Step 2 — Set Up Your Markers

#### Single Marker

Use this to highlight one specific location. Enter a street address directly or pull it from a Salesforce field.

> **Example:** A flow that opens on an Account record and shows the account's billing address on the map.

#### Multiple Markers

Display a collection of locations from a Salesforce object. The setup has two parts:

1. **Choose a data source** — where the location data comes from
2. **Map the fields** — which Salesforce fields contain the address or coordinates

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

### Data Source Options

<table><thead><tr><th width="130.611328125">Option</th><th>What it does</th><th>When to use</th></tr></thead><tbody><tr><td><strong>Manual</strong><br></td><td>Enter coordinates directly in the component</td><td>Fixed locations that never change</td></tr><tr><td><strong>Variable</strong></td><td>Connect to a Flow variable</td><td>Locations that change as the flow runs</td></tr><tr><td><strong>Query</strong></td><td>Pull from a Salesforce object or custom query</td><td>Large datasets, complex filters, or record-driven maps</td></tr></tbody></table>

{% hint style="success" %}

#### Tip

For most "show all records on a map" use cases, use **Query** and point it at your object (Accounts, Contacts, custom objects, etc.)
{% endhint %}

#### Data Mappings

Once you've chosen a data source, map your Salesforce fields to the component's location attributes. At minimum, you need to map the **Location** section — this is what places the pins on the map.

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

{% hint style="info" %}
Mapping the Location section is vital for correctly placing markers on the map.
{% endhint %}

***

## Leaflet-Only Features

The features below are only available when **Leaflet Maps** is selected as your map type.

### Marker Clustering

When you have hundreds of pins, the map becomes unreadable. Clustering solves this by grouping nearby pins into a numbered circle.

**How it works:**

* **Zoomed out:** Pins in the same area merge into a single circle — e.g., a circle showing "50" means 50 accounts in that region.
* **Zooming in:** The circle splits into smaller clusters, then individual pins.

> **Example:** A map of 600 customer accounts. Zoomed out, users see 4–5 regional clusters. Zooming into a city reveals individual account pins.

<figure><img src="/files/3PwwhxYY6r4wYZQ0Yqfs" alt=""><figcaption></figcaption></figure>

### Clustering Settings

<table><thead><tr><th width="299.703125">Setting</th><th>What it does</th></tr></thead><tbody><tr><td><strong>Coverage on Hover</strong></td><td>Hovering over a cluster shows the boundary it covers</td></tr><tr><td><strong>Max Cluster Radius</strong></td><td>How far (in pixels) from a pin before it joins a cluster. Default: 80px. Increase to create fewer, larger clusters.</td></tr><tr><td><strong>Disable Clustering at Zoom Level</strong></td><td>Below this zoom level, all individual pins display — useful so users can always see exact locations when zoomed in</td></tr></tbody></table>

### Drawing & Annotations

The Draw feature turns your map into an interactive canvas. Users can draw directly on the map and save those drawings to a Salesforce record.

> **Example:** A territory planning flow where a manager draws a polygon around a new sales zone, and it saves automatically to the related Opportunity.

**Enabling Drawing**

1. Select **Leaflet** as your map type
2. Toggle on **Draw Feature** in the component settings
3. The drawing toolbar appears on the map

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

**Available Drawing Tools**

<table><thead><tr><th width="169.8203125">Tool</th><th>Use It to</th></tr></thead><tbody><tr><td>📍 <strong>Marker</strong></td><td>Pin a specific address or point of interest</td></tr><tr><td>➖ <strong>Line</strong></td><td>Show a route, path, or connection between locations</td></tr><tr><td>▨ <strong>Polygon</strong></td><td>Outline a territory, service area, or neighborhood</td></tr><tr><td>⭕ <strong>Circle</strong></td><td>Define a delivery radius or zone of influence</td></tr><tr><td>✏️ <strong>Edit</strong></td><td>Resize or reposition existing shapes</td></tr><tr><td>🗑️ <strong>Delete</strong></td><td>Remove unwanted drawings</td></tr></tbody></table>

You can choose which tools to show and where the toolbar appears (top-left, top-right, bottom-left, bottom-right).

**Saving Drawings to a Salesforce Record**

Drawings are saved as a **Content Document** (Salesforce File) linked to a record.

1. Enable **Save as Content Document** in the component settings
2. Set **Content Document Linked Entity ID** to the record's ID — typically `{!recordId}` from your flow variable
3. *(Optional)* Enable **Auto Save Content Document** to save changes automatically without a manual save step

**Optional settings**

<table><thead><tr><th width="210.3671875">Setting</th><th>Purpose</th></tr></thead><tbody><tr><td><strong>Content Document ID</strong></td><td>Load an existing Content Document rather than creating a new one</td></tr><tr><td><strong>Content Document Title</strong></td><td>Custom file name — default is "Avonni Map Drawing Document." Example: <code>Map Drawings - {!Account.Name}</code></td></tr></tbody></table>

### GeoJSON — Territories & Custom Boundaries

GeoJSON lets you overlay custom shapes on the map — county lines, sales territories, zip code boundaries, or any other polygon. Think of it as a "stencil layer" on top of the map.

**Two ways to use GeoJSON:**

<table><thead><tr><th width="181.09765625"></th><th>Static (Read-Only)</th><th>Editable</th></tr></thead><tbody><tr><td><strong>Property to use</strong></td><td>GeoJSON Value</td><td>Draw Content Document ID</td></tr><tr><td><strong>Users can edit?</strong></td><td>❌</td><td>✅</td></tr><tr><td><strong>Best for</strong></td><td>Showing assigned territories a user can't change</td><td>Starting from a boundary and letting users reshape it</td></tr></tbody></table>

### **Custom Tile Layer (Basemap Style)**

By default, the Leaflet map uses OpenStreetMap tiles. The **Tile Layer** property lets you swap in any Leaflet-compatible tile server — useful for brand-aligned styling, satellite imagery, dark mode, or specialized basemaps like terrain and topographic.

<figure><img src="/files/9Yq9uTTv3e8Gz0sUsy6F" alt=""><figcaption></figcaption></figure>

**How it works**

In the **Map** section of the property editor (under Advanced), set **Tile Layer** to a tile URL template using `{z}`, `{x}`, `{y}` placeholders. Leaflet handles the swap automatically.

**Common tile layer URLs**

| Style                              | URL template                                                                                    | Best for                            |
| ---------------------------------- | ----------------------------------------------------------------------------------------------- | ----------------------------------- |
| **OpenStreetMap** *(default)*      | `https://tile.openstreetmap.org/{z}/{x}/{y}.png`                                                | General-purpose maps                |
| **Carto Positron** (clean light)   | `https://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png`                                   | Dashboards, data viz                |
| **Carto Dark Matter** (dark)       | `https://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png`                                    | Analytics dashboards, dark themes   |
| **Esri World Imagery** (satellite) | `https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}` | Field ops, real estate, agriculture |
| **OpenTopoMap** (terrain)          | `https://a.tile.opentopomap.org/{z}/{x}/{y}.png`                                                | Outdoor, rural logistics            |

> **Example:** A logistics dashboard uses Carto Dark Matter tiles so colored pins and clusters stand out against a low-contrast background.

{% hint style="info" %}
This property only applies when **Leaflet** is selected as the map type. Google Maps tiles are not user-replaceable
{% endhint %}

{% hint style="warning" %}

#### Warning

Some tile providers (Mapbox, MapTiler, Stadia Maps) require an API key inside the URL and enforce usage limits. The default OpenStreetMap endpoint is fine for prototyping, but it isn't suitable for production traffic — review each provider's terms of service before going live.
{% endhint %}

### Displaying Static GeoJSON

Set the **GeoJSON Value** property using one of:

* A single GeoJSON object (one shape)
* An array of GeoJSON objects (multiple shapes)
* A **Content Document ID** pointing to a `.geojson` file in Salesforce Files *(recommended for large datasets — max file size: 12MB)*

> **Example:** Show a rep their assigned region as a shaded polygon. They can see it, but can't modify it.

### Loading Editable GeoJSON

Use **Draw Content Document ID** to load a starting set of shapes that users can then modify.

1. Save your GeoJSON as a Salesforce File
2. Enter its Content Document ID in the **Draw Content Document ID** field
3. This automatically enables the drawing toolbar
4. Users can move, resize, add, or delete shapes
5. To save changes, enable **Save as Content Document** — without this, edits are lost when the flow advances

> **Example:** A customer success manager loads a territory polygon for a key account, adjusts the boundary to match a new agreement, and saves it back to the record.

***

## Map Display Settings

### Centering the Map

By default, the map auto-centers to fit all markers. You can override this in four ways:

| Method                   | When to use                                                              |
| ------------------------ | ------------------------------------------------------------------------ |
| **Default**              | Let the map decide — works well for most cases                           |
| **Lat/Long coordinates** | Pin the center to a specific geographic point                            |
| **Address fields**       | Use country + city (required) + optional street/postal code              |
| **Flow variables**       | Dynamically center based on record data — e.g., `{!Account.BillingCity}` |

**Display Center as Marker:** Enable this to place a visible pin at the center point you've set — useful for "find locations near this address" flows.

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

### Zoom Level

Set the initial zoom manually (1–22 on desktop, 1–20 on mobile):

<table><thead><tr><th width="122.23046875">Level</th><th>What you see</th></tr></thead><tbody><tr><td>1</td><td>The entire world</td></tr><tr><td>5</td><td>A continent</td></tr><tr><td>10</td><td>A city</td></tr><tr><td>15</td><td>Street-level</td></tr><tr><td>20</td><td>Individual buildings</td></tr></tbody></table>

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

### Header

The Header section gives you control over the appearance and functionality of your Map header.

| Attribute     | Purpose                                                            |
| ------------- | ------------------------------------------------------------------ |
| **Title**     | Label for the map — shown at the top                               |
| **Caption**   | Short description or context                                       |
| **Icon**      | Visual indicator of map purpose                                    |
| **Is Joined** | Removes shadow/border so the map blends with an adjacent component |
| **Buttons**   | Action buttons in the header — wired to interactions (see below)   |

### List View

Controls the sidebar list of locations alongside the map.

| Value              | Behavior                                              |
| ------------------ | ----------------------------------------------------- |
| `auto` *(default)* | Shows the list only when multiple markers are present |
| `visible`          | Always shows the list                                 |
| `hidden`           | Always hides the list                                 |

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

### Filtering & Search

* **Filtering Option:** Adds a filter menu (popover) so users can narrow down which markers are shown

<figure><img src="/files/I5lGTOW9ZGRUCENVgbrL" alt="" width="563"><figcaption></figcaption></figure>

* **Searchable:** Adds a search bar to the map. Configure placeholder text and position (`left`, `right`, `center`, `fill`)

***

## Marker Customization

The **Type** attribute controls each marker's visual style.

<table><thead><tr><th width="177.89453125">Type</th><th>Description</th></tr></thead><tbody><tr><td><strong>Default</strong></td><td>Standard map pin</td></tr><tr><td><strong>Circle</strong></td><td>Round marker — set radius, fill color, opacity, and stroke</td></tr><tr><td><strong>Rectangle</strong></td><td>Box marker — set boundaries using lat/long, fill, and stroke</td></tr><tr><td><strong>Polygon</strong></td><td>Custom multi-sided shape — define paths, fill, and stroke</td></tr><tr><td><strong>Pin</strong></td><td>Classic teardrop pin — customize fill color and stroke</td></tr><tr><td><strong>Custom Icon</strong></td><td>Upload your own SVG for full brand-aligned markers</td></tr></tbody></table>

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

**Common styling options (all shape types):**

* **Fill Color & Opacity** — background color and transparency
* **Stroke** — border color, thickness, and style
* **Scale** — zoom level the marker is optimized for

> **What's an SVG Path?** It's a set of drawing instructions used to create custom icon shapes. You can generate SVG paths using any vector design tool (Figma, Illustrator, online SVG editors).&#x20;
>
> <mark style="color:green;">**→ Tutorial:**</mark> [<mark style="color:green;">**Customize the Map Marker**</mark>](/flow/tutorials/components/map/customize-the-map-marker.md)

***

## Map Interactions

Wire up map events to Flow actions using these triggers:

| Interaction          | Fires when...                      | Common use                                                          |
| -------------------- | ---------------------------------- | ------------------------------------------------------------------- |
| **On Marker Select** | User clicks a pin                  | Show a detail panel, navigate to a record, or filter a related list |
| **On Header Action** | User clicks a header button        | Trigger a search, apply a filter, or open a modal                   |
| **On Marker Drag**   | User drags a pin to a new location | Update lat/long coordinates on a record                             |

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

***

## Output Variables

The Map exposes several output variables you can reference in your flow after the screen. To use them, select the screen element in Flow Builder, then the Map component, and pick the output variable you need.

### Marker Selection

When users click a marker on the map, these variables update automatically.

| Output variable                   | Type             | What it returns                                                                                                                                                          |
| --------------------------------- | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| **Selected Marker Value**         | Text (String)    | The value (usually the record ID or name) of the marker the user clicked.                                                                                                |
| **Selected Marker SObject Value** | Record (SObject) | The full Salesforce record associated with the selected marker. Use this to display record details on the next screen or update the record in a subsequent flow element. |

> **Example:** When a user clicks a marker on an Account map, use **Selected Marker SObject Value** to display the Account's details on the next screen or pre-fill a form for a follow-up Task.

### Marker Dragging

When users drag a marker to a new location (requires **Draggable Markers** to be enabled), these variables capture the new position and the marker data.

| Output variable                    | Type                           | What it returns                                                           |
| ---------------------------------- | ------------------------------ | ------------------------------------------------------------------------- |
| **Dragged Marker Value**           | Text (String)                  | The value (usually the record ID or name) of the marker the user dragged. |
| **Dragged Marker SObject Value**   | Record (SObject)               | The full Salesforce record of the marker that was dragged.                |
| **Dragged Marker Latitude**        | Text (String)                  | The new latitude of the dragged marker.                                   |
| **Dragged Marker Longitude**       | Text (String)                  | The new longitude of the dragged marker.                                  |
| **Dragged Map Markers**            | Collection                     | All markers with their updated positions after dragging.                  |
| **Dragged Map Markers Serialized** | Text (String)                  | All dragged markers as a JSON string.                                     |
| **Dragged Map Markers SObject**    | Record Collection (SObject\[]) | All markers with updated positions as a collection of Salesforce records. |

> **Example:** A field technician drags a marker to correct a site location. After the screen, use **Dragged Marker Latitude** and **Dragged Marker Longitude** with an **Update Records** element to save the corrected coordinates back to the record.

### Marker Creation

When users create a new marker on the map (via the drawing tools), these variables capture the new marker's position.

| Output variable              | Type          | What it returns                            |
| ---------------------------- | ------------- | ------------------------------------------ |
| **Created Marker Latitude**  | Text (String) | The latitude of the newly created marker.  |
| **Created Marker Longitude** | Text (String) | The longitude of the newly created marker. |

> **Example:** A dispatcher creates a new marker on the map to mark a delivery location. Use **Created Marker Latitude** and **Created Marker Longitude** to create a new record with those coordinates.

### Drawing Tools

When users use the drawing tools on the map, these variables capture the drawn shapes.

| Output variable         | Type          | What it returns                                                                                                                                          |
| ----------------------- | ------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Draw GeoJSON Value**  | Text (String) | The GeoJSON representation of all shapes drawn on the map. Use this to save the drawn area to a record or pass it to an Apex action for spatial queries. |
| **Content Document Id** | Text (String) | The ID of the Content Document if the drawing was saved as a file (when **Save As Content Document** is enabled).                                        |

> **Example:** A territory manager draws a polygon on the map to define a sales territory. Use **Draw GeoJSON Value** to store the territory boundaries in a custom field on a Territory record.

### Header Actions

| Output variable                | Type          | What it returns                                                                                                                                  |
| ------------------------------ | ------------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
| **Clicked Header Action Name** | Text (String) | The name of the header action button the user clicked. Use in a **Decision** element to route the flow based on which header button was pressed. |

### Map Metadata

| Output variable        | Type    | What it returns                                                                                                                                              |
| ---------------------- | ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| **Number of Items**    | Integer | The total number of markers currently loaded on the map. Useful for displaying a count or making decisions when the map has no markers.                      |
| **Visible Width (km)** | Integer | The visible width of the map in kilometers at the current zoom level. Useful for dynamically adjusting queries or filtering based on the map's visible area. |

***

## Troubleshooting

| Problem                                                                             | Cause                                                                                                                                                                                                                                                  | Fix                                                                                                                                                                                                                                           |
| ----------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| The map loads but no markers appear                                                 | The records have no usable location data. A marker requires either Latitude + Longitude, or at least one of City, State, Postal Code, or Country.                                                                                                      | In **Data Mappings**, map at least one of **Street**, **City**, **State**, **Postal Code**, **Country**, or **Latitude + Longitude** to a populated field on the source object. Confirm the records actually contain a value (not all blank). |
| Markers show in Google Maps mode but disappear when switching to Leaflet            | Leaflet only supports markers placed by **Latitude + Longitude**. Address-based fields (Street, City, etc.) are ignored by Leaflet because it doesn't include geocoding.                                                                               | Either stay on Google Maps for address-based maps, or populate Latitude/Longitude fields on the records (Salesforce auto-fills these for standard Address fields when geocoding rules are enabled).                                           |
| Dragging a marker visually moves it, but the new position isn't saved on the record | The **Latitude** and **Longitude** fields aren't mapped in **Data Mappings**, or the running user has no **Edit** FLS on those fields. The component writes the new coordinates back to the mapped fields — without them, the change is purely visual. | In **Data Mappings**, map both **Latitude** and **Longitude** to writeable number fields on the source object, and grant **Edit** FLS to the running user.                                                                                    |
| The map shows a gray empty area instead of tiles                                    | For Google Maps: a Salesforce-side configuration is missing (geocoding service or Maps API). For Leaflet: the **Tile Layer** URL is invalid or unreachable from the user's network.                                                                    | In Google Maps mode, check **Setup → Maps and Location Settings**. In Leaflet mode, leave the **Tile Layer** field blank to use the default OpenStreetMap layer.                                                                              |
| Drawings made on the map (polygons, rectangles, circles) aren't saved               | The component is configured for drawing but **Auto Save Content Document** is off and no **Save As Button** is shown. Drawings stay in memory until they're explicitly saved as a ContentDocument.                                                     | Toggle **Auto Save Content Document** on, or display the **Save As Button** so users can save manually.                                                                                                                                       |
| Drawings are saved but not attached to a specific record                            | The **Content Document Linked Entity Id** is empty. Without it, drawings save as standalone files in the user's Files area, not as attachments to a record.                                                                                            | Map **Content Document Linked Entity Id** to a record ID variable (typically `{!recordId}`). The drawing will then appear under **Files** on that record.                                                                                     |
| Marker clustering doesn't activate                                                  | **Cluster** is on, but Clustering only works in Google Maps mode with **Latitude + Longitude** mappings. It's ignored in Leaflet mode and for address-based markers.                                                                                   | Switch to Google Maps and confirm **Latitude + Longitude** are mapped.                                                                                                                                                                        |
| The map doesn't filter by `{!recordId}` even though `{!recordId}` is referenced     | The Data Source is set to **Variable** instead of **Query**, so server-side filtering doesn't apply. Variable mode shows whatever's in the variable.                                                                                                   | Either switch to **Query** mode and add a Query Filter that references `{!recordId}`, or filter the variable upstream with a Get Records element that takes `{!recordId}` as a filter.                                                        |
| Single marker mode shows no marker, even with values entered                        | At least one location field must be populated. The component silently hides the marker if every location field is empty or blank.                                                                                                                      | Make sure at least one of Latitude+Longitude, City, State, Postal Code, or Country is filled at runtime.                                                                                                                                      |
| The selected marker output variable is always empty                                 | The user hasn't clicked a marker yet, or the **Marker Select** event is being intercepted by an interaction that opens a Flow Panel without populating the output.                                                                                     | Add a **Decision** element after the screen to handle the empty case, and confirm the **Marker Select** interaction (if any) is wired correctly in the **Interactions** tab.                                                                  |

***


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.avonnicomponents.com/flow/flow-components/map.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
