> For the complete documentation index, see [llms.txt](https://docs.gridmate.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.gridmate.io/package-reference/components-library/gm-map-list.md).

# GM - Map List

(gmpkg:mapListLWC)

## **Documentation**

**GM - Map List** component enables users to conveniently map multiple records for any object (Standard or Custom). This component offers a unique blend of map view and list view, facilitating record filtering and action-taking capabilities.

**Use case:** Display list of Accounts on Google Maps and filter Accounts by Billing Country. See [GM - Map List](/product-tour/map-list.md).

## **Specification**

{% hint style="info" %}
The **GM - Map List** component requires either a street set of fields (Street, City, Postal Code, State, Country) or a geolocation (Latitude, Longitude) to map a given object.
{% endhint %}

{% hint style="warning" %}
If the map provider is OSM only geolocations (Latitude, Longitude) are supported.
{% endhint %}

<table data-full-width="true"><thead><tr><th width="246">Property</th><th width="119.33333333333331">Type</th><th>Description</th></tr></thead><tbody><tr><td>Map Provider</td><td>String</td><td>The map provider: <strong>google</strong> | <strong>osm</strong>. The default value is osm.</td></tr><tr><td>Object Name *</td><td>String</td><td>The API name of the object to map. Don’t forget __c for custom objects.</td></tr><tr><td>Custom Label</td><td>String</td><td>Set a specific label for the component.</td></tr><tr><td>Filter</td><td>String</td><td>JSON string to define filter criteria. Don’t forget __c for custom fields. See <a href="/package-reference/components-library/gm-relatedlist-grid.md#specification">GM - RelatedList Grid</a> <strong>filter</strong> property for more details.</td></tr><tr><td>Row Limit</td><td>Integer</td><td>The maximum number of records to fetch. The default value is 5000.</td></tr><tr><td>Street Field</td><td>String</td><td>The API name of the street field. Ex <strong>BillingStreet</strong>.</td></tr><tr><td>City Field</td><td>String</td><td>The API name of the city field. Ex <strong>BillingCity</strong>.</td></tr><tr><td>Postal Code Field</td><td>String</td><td>The API name of the postal code field. Ex <strong>BillingPostalCode</strong>.</td></tr><tr><td>State Field</td><td>String</td><td>The API name of the state field. Ex <strong>BillingState</strong>.</td></tr><tr><td>Country Field</td><td>String</td><td>The API name of the country field. Ex <strong>BillingCountry</strong>.</td></tr><tr><td>Latitude Field</td><td>String</td><td>The API name of the latitude field. Ex <strong>BillingLatitude</strong>.</td></tr><tr><td>Longitude Field</td><td>String</td><td>The API name of the longitude field. Ex <strong>BillingLongitude</strong>.</td></tr><tr><td>Title Field *</td><td>String</td><td>The field displayed as the title of each record. Records are sorted by this field.</td></tr><tr><td>Popover Fields</td><td>String</td><td>The field displayed as the record description and in the marker popover. When empty, the <strong>Detail Fields</strong> are used for the popover.</td></tr><tr><td>Detail Fields</td><td>String</td><td>',' separated list of fields to display in the record details.</td></tr><tr><td>Search Fields</td><td>String</td><td>',' separated list of fields used by the search box.</td></tr><tr><td>Enable Filtering</td><td>Boolean</td><td>Check this option to allow the end-user to filter the records.</td></tr><tr><td>Marker Icon</td><td>String</td><td>The icon used for the map markers. All lightning icons are supported. You can get the icon name from <a href="https://lightningdesignsystem.com/icons/">https://lightningdesignsystem.com/icons/</a></td></tr><tr><td>List Icon</td><td>String</td><td>The icon used for the items of the list.</td></tr><tr><td>Show Border</td><td>Boolean</td><td>Check this option to display a border around the component.</td></tr><tr><td>Map Height</td><td>Integer</td><td>The height of the map. The default value is 750.</td></tr><tr><td>Marker Coloring</td><td>String</td><td>JSON configuration to define the marker colors and the corresponding conditions.</td></tr><tr><td>Search Around</td><td>String</td><td>JSON configuration to search records around a location. See <a href="/advanced-guides/map-list-search-around.md">Map List Search Around</a>.</td></tr><tr><td>Actions</td><td>String</td><td>JSON string to initialize the list of available actions. See the <a href="/advanced-guides/actions-library.md">actions configuration example</a>.</td></tr><tr><td>Record Actions</td><td>String</td><td>JSON string to initialize the list of available record actions.</td></tr><tr><td>Show Clusters</td><td>Boolean</td><td>Check this option to group nearby markers into clusters. See <a href="/advanced-guides/map-list-marker-clusters.md">Map List Marker Clusters</a>.</td></tr></tbody></table>

## **API Reference**

{% tabs fullWidth="true" %}
{% tab title="mapListLWC.js-meta.xml" %}

```xml
<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>65.0</apiVersion>
    <masterLabel>GM - Map List</masterLabel>
    <isExposed>true</isExposed>
    <targets>
        <target>lightning__RecordPage</target>
        <target>lightning__AppPage</target>
        <target>lightning__HomePage</target>
        <target>lightningCommunity__Page</target>
        <target>lightningCommunity__Default</target>
    </targets>
    <targetConfigs>
        <targetConfig targets="lightning__RecordPage,lightning__AppPage,lightning__HomePage">
            <property
                name="mapProvider"
                type="String"
                label="Map Provider"
                description="Map Provider : (google | osm)"
            />

            <property name="objectName" type="String" label="Object Name" description="Object API Name" />
            <property name="customLabel" type="String" label="Custom Label" description="Custom Label" />
            <property name="filter" type="String" label="Filter" description="JSON Filters" />
            <property name="rowLimit" type="Integer" label="Row Limit" description="Max # of row to fetch" />

            <property name="streetField" type="String" label="Street Field" description="Street Field" />
            <property name="cityField" type="String" label="City Field" description="City Field" />
            <property name="postalCodeField" type="String" label="Postal Code Field" description="Postal Code Field" />
            <property name="stateField" type="String" label="State Field" description="State Field" />
            <property name="countryField" type="String" label="Country Field" description="Country Field" />

            <property name="latitudeField" type="String" label="Latitude Field" description="Latitude Field" />
            <property name="longitudeField" type="String" label="Longitude Field" description="Longitude Field" />

            <property name="titleField" type="String" label="Title Field" description="Title Field" />
            <property name="descriptionField" type="String" label="Popover Fields" description="Popover Fields" />
            <property name="detailFields" type="String" label="Detail Fields" description="Detail Fields" />

            <property
                name="searchFields"
                type="String"
                label="Search Fields"
                description="',' separated search fields"
            />
            <property
                name="canFilter"
                type="Boolean"
                label="Enable Filtering"
                description="Check this option if you want to use filters"
            />

            <property name="mapIcon" type="String" label="Marker Icon" description="Map Marker Icon" />
            <property name="listIcon" type="String" label="List Icon" description="Item List Icon" />

            <property name="showBorder" type="Boolean" label="Show Border" description="Show Border" />
            <property name="height" type="Integer" label="Map Height" description="Map Height" />

            <property
                name="colring"
                type="String"
                label="Marker Coloring"
                description="JSON Marker Coloring Configuration"
            />

            <property
                name="searchAround"
                type="String"
                label="Search Around"
                description="JSON Search Around Configuration"
            />

            <property
                name="jsonActions"
                type="String"
                label="Actions"
                description="Json string to initialize the list of available actions"
            />

            <property
                name="jsonRecordActions"
                type="String"
                label="Record Actions"
                description="Json string to initialize the list of available record actions"
            />

            <property
                name="showClusters"
                type="Boolean"
                label="Show Clusters"
                description="Check this option if you want to show clusters"
            />

            <property
                name="wildCard"
                type="String"
                label="xxx(deprecated)"
                description="Deprecated. Ignore this property"
            />
            <property
                name="wildCardSearch"
                type="String"
                label="zzz(deprecated)"
                description="Deprecated. Ignore this property"
            />
        </targetConfig>
        <targetConfig targets="lightningCommunity__Default">
            <property
                name="mapProvider"
                type="String"
                label="Map Provider"
                description="Map Provider : (google | osm)"
            />

            <property name="objectName" type="String" label="Object Name" description="Object API Name" />
            <property name="customLabel" type="String" label="Custom Label" description="Custom Label" />
            <property name="filter" type="String" label="Filter" description="JSON Filters" />
            <property name="rowLimit" type="Integer" label="Row Limit" description="Max # of row to fetch" />

            <property name="streetField" type="String" label="Street Field" description="Street Field" />
            <property name="cityField" type="String" label="City Field" description="City Field" />
            <property name="postalCodeField" type="String" label="Postal Code Field" description="Postal Code Field" />
            <property name="stateField" type="String" label="State Field" description="State Field" />
            <property name="countryField" type="String" label="Country Field" description="Country Field" />

            <property name="latitudeField" type="String" label="Latitude Field" description="Latitude Field" />
            <property name="longitudeField" type="String" label="Longitude Field" description="Longitude Field" />

            <property name="titleField" type="String" label="Title Field" description="Title Field" />
            <property name="descriptionField" type="String" label="Description Field" description="Description Field" />
            <property name="detailFields" type="String" label="Detail Fields" description="Detail Fields" />

            <property
                name="searchFields"
                type="String"
                label="Search Fields"
                description="',' separated search fields"
            />
            <property
                name="canFilter"
                type="Boolean"
                label="Enable Filtering"
                description="Check this option if you want to use filters"
            />

            <property name="mapIcon" type="String" label="Marker Icon" description="Map Marker Icon" />
            <property name="listIcon" type="String" label="List Icon" description="Item List Icon" />

            <property name="showBorder" type="Boolean" label="Show Border" description="Show Border" />
            <property name="height" type="Integer" label="Map Height" description="Map Height" />

            <property
                name="colring"
                type="String"
                label="Marker Coloring"
                description="JSON Marker Coloring Configuration"
            />

            <property
                name="searchAround"
                type="String"
                label="Search Around"
                description="JSON Search Around Configuration"
            />

            <property
                name="jsonActions"
                type="String"
                label="Actions"
                description="Json string to initialize the list of available actions"
            />

            <property
                name="jsonRecordActions"
                type="String"
                label="Record Actions"
                description="Json string to initialize the list of available record actions"
            />

            <property
                name="showClusters"
                type="Boolean"
                label="Show Clusters"
                description="Check this option if you want to show clusters"
            />

            <property
                name="wildCard"
                type="String"
                label="xxx(deprecated)"
                description="Deprecated. Ignore this property"
            />
            <property
                name="wildCardSearch"
                type="String"
                label="zzz(deprecated)"
                description="Deprecated. Ignore this property"
            />
        </targetConfig>
    </targetConfigs>
</LightningComponentBundle>
```

{% endtab %}
{% endtabs %}
