Join the Team Forms community

Updated 7 months ago

Maps

At a glance

The community member is asking how to add a map for an address in a form and how to concatenate addresses from a table with separate columns for Address, City, State, and Zip Code. A community member responds with an example of how to use the built-in address component and a location component to map an address, including how to use calculated values to dynamically set the latitude, longitude, map type, and zoom level. However, there is no explicitly marked answer to the original question.

How can do you add a map for an address in a form also is it possible to concatenate Addresses. ( I have a table that has Address, City, State and Zip Code in separate columns i would like to be put in a text filed.

E
1 comment

Hi Sky,

To map an address you will need the latitude and longitude co-ordinates for that address. If you're using the in-build address component, then then the co-ordinates are automatically available for mapping. Here's an example of how you can do this:

  1. Drag and drop an address component into your form

  2. Drag and drop a location component into your form. This will be used to map the address selected.

  3. In the location components setting navigate to the Data tab > Calculated Value. Here we will use calculated values to dynamically set the mapped location. For the JavaScript expression you can use the following, note that you will need to adapt the expression for your specific form.

    value = {
        "latitude": data.address?.geometry?.location.lat,
        "longitude": data.address?.geometry?.location.lng,
        "mapTypeId": "roadmap",
        "zoom": 15
    }

Here is an example of the end result: