Formatted Address

lightning:formattedAddress

Displays a formatted address that provides a link to the given location on Google Maps. This component requires API version 42.0 and later.

For Aura components only. For LWC development, use lightning-formatted-address.

For Use In

Lightning Experience, Experience Builder Sites, Salesforce Mobile App, Lightning Out (Beta), Standalone Lightning App

A lightning:formattedAddress component displays addresses in a format and field order that’s determined by the user’s Salesforce locale.

Specify a valid address using attributes for street, city, country, province, and postalCode.

This example displays an address.

1<aura:component>
2  <lightning:formattedAddress
3    street="1 Market St."
4    city="San Francisco"
5    country="US"
6    province="CA"
7    postalCode="94105"
8  />
9</aura:component>

The output looks like this in the en-US locale.

1 Market St.

San Francisco, CA 94105

US

By default, the address is displayed as a link that opens the given location in Google Maps in a new tab. The link follows the format https://www.google.com/maps/?q=your+address.

In the example, the link would be https://www.google.com/maps/?q=121%20Spear%20St.%0ASan%20Francisco,%20CA%2094105%0AUS.

Specify the disabled attribute to display the address in plain text without a link.

Specifying Coordinates for Mapping 

You can provide the latitude and longitude attributes in addition to the address fields. This enables faster map rendering by avoiding the geocode processing that’s required for street addresses on Google Maps. The formatted address displays the street address fields, but the link URL uses the latitude and longitude for Google Maps.

This example displays an address and uses latitude and longitude for mapping.

1<aura:component>
2  <lightning:formattedAddress
3    street="1 Market St."
4    city="San Francisco"
5    country="US"
6    province="CA"
7    postalCode="94105"
8    latitude="37.792179"
9    longitude="-122.392735"
10  />
11</aura:component>

The link URL with latitude and longitude follows the format https://www.google.com/maps/?q=37.792179,-122.392735.

Showing a Static Map 

Use the showStaticMap attribute to display a map with your address. The address and the static map are both linked to Google Maps.

1<aura:component>
2  <lightning:formattedAddress
3    street="1 Market St."
4    city="San Francisco"
5    country="US"
6    province="CA"
7    postalCode="94105"
8    showStaticMap="true"
9  />
10</aura:component>

Attributes 

NameDescriptionTypeDefaultRequired
bodyThe body of the component. In markup, this is everything in the body of the tag.Aura.Component[]
cityThe city detail for the address.String
classA CSS class for the outer element, in addition to the component's base classes.String
countryThe country detail for the address.String
disabledSpecifies whether the address is clickable. This value defaults to false.Boolean
latitudeThe latitude of the location if known. Latitude values must be within -90 and 90.Decimal
longitudeThe longitude of the location if known. Longitude values must be within -180 and 180.Decimal
postalCodeThe postal code detail for the address.String
provinceThe province detail for the address.String
showStaticMapDisplays a static map of the location using Google Maps. This value defaults to false.Boolean
streetThe street detail for the address.String
titleDisplays tooltip text when the mouse moves over the element.String

Methods 

NameDescriptionArgument NameArgument TypeArgument Description
clickSimulates a mouse click on the address and navigates to Google Maps on a new tab.