Using External Media fields for map display

An External Media field can be configured to display videos and images hosted at external URLs. This is useful for providing examples and instructions to help users navigate your app or their physical work.

External Media fields support the following field types: "Image", "Audio", "Video" and "YouTube".

To display images in PNG, JPEG, and GIF formats from an external URL, select "Image".

Selecting "Audio" displays an audio player that can play external audio files.

"YouTube" and "Video" fields display video content using a video player. However, "YouTube" should only be used with YouTube-hosted links, while "Video" supports video URLs in formats such as MOV and MPEG4.

To display external content you just need to create and submit a GET web request to the specified external URL to retrieve and display the content.

Switching the External Media field to Formula mode enables you to generate dynamic URLs, and external content is re-requested upon every update of a URL.

Usage of External Media Field to display Map tiles

A useful feature of the External Media field is the ability to display Map Tiles from a specific area. A Map Tile is essentially a static image of a map area in PNG or JPEG format.

There are multiple map service providers (Google Maps, MapBox, TomTom, Here, Azure Maps, Geoapify, MapQuest, etc.) that support returning a Map Tile as a parametrized web request.

Please review the License Agreement of your map service provider to ensure compliance with their terms and conditions.

In combination with an External Media field, this enables you to obtain and display a Map Tile within a record, PDF report, Rich Text report or email notification.

Configuring an External Media field to display Map Tiles from MapBox

The Map Tile API is similar across map service providers; it is based on a parametrized web GET request that returns an image as a response.

Here's how to configure an External Media Field to display a Map Tile from MapBox:

1. Sign in to MapBox to obtain a Public Token key used to authenticate a web request from Flowfinity to the MapBox Static Images API.
   
2. Go to the Static Images API page to review the concepts and details of API usage.
3. On the Static Images API Playground page try the Request URL builder. It produces a Request URL to be queried from the Flowfinity External Media field. The mandatory URL parameters are: Access Token, Map Style, Tile Size, Coordinates of Center, and Zoom. The optional parameters are: Tilt, Bearing, and Markers. It is possible to put a Marker or a set of Markers on a Map Tile.
   
4. The resulting Request URL for requesting a Map Tile with a single pin on it will look something like:
   
   https://api.mapbox.com/styles/v1/mapbox/streets-v11/static/pin-s+555555(-122.798,49.172)/-122.798,49.172,15,0/300x200?access_token=
   where:
   -'streets-v11' stands for Map Style
   -'static/pin-s+555555(-122.798,49.172)' stands for the Pin
   -'122.798,49.172,15,0' stands for the Coordinates of Center and Zoom -'300x200' part is the Tile Size in pixels


5. Once the URL is configured with the MapBox Static Images API URL structure, login to Flowfinity to create an app to display a Map Tile with a Pin in an External Media field.
6. In the example below, Request URL parameters are taken out as individual fields to deliver interactivity: Coordinates, Tile Size, Zoom, Map Style
   
7. The MapBoxURL is a calculated field using the URL field type that combines all the necessary parameters to produce a Request URL to query the MapBox Static Image API.
8. An External Media field is set to ue the Image media type and references the MapBoxURL field
   
9. As a result there is a fully interactive solution displaying a Map Tile with a pin as per the parameters passed via the Request URL to the MapBox Static Images API. The Map Tile is refreshed when any parameter is changed.