map

A map layer is used to create an interactive map that can be used to visualize markers and routes.

Field Configurations

Key	Type	Description	Default Value
"clickReaction"	MapClickReaction	Reaction on tapping a marker	"actionsAndInfo"
"enableClustering"	Boolean	Defines if nearby markers should be grouped into a single marker.	false
"filterOptions"	Object	Defines options for filters, contains filterType (single,multi) and filterStyle (default,button). Only used if filterType or filterStyle is not set.	"filterType: multi, filterSyle: default"
"filterSetting"	String	Defines the key for saving filter in the _settings database table if saveSettings action is performed.	null
"filterStyle"	String	Defines the style of the filter.	null
"filterType"	String	Defines how the parameters of the query used for filtering are transferred.	"regex"
"filters"	Filters	Defines a list of the filters for the map content.	null
"hideFilters"	Boolean	Defines whether the filters are hidden.	false
"iconType"	String	Displays only the marker's icon instead of displaying it inside of a regular marker. Possible values is complete and inside (iOS only).	null
"initialPosition"	InitialPosition	List of the possible value for configuring initial position on the map.	null
"instantSearch"	Boolean	Defines if the search is performed on each character input.	false
"itemActions"	Array	List of the actions which will be fired when the marker is interacted with. Going to be evaluated only if data comes from database table.	null
"makeRouteOfMarkers"	Boolean	Defines whether route should be created from markers.	false
"mapStyle"	String	Defines the style of the map (Android only). For possible values see: https://developers.google.com/maps/documentation/android-sdk/style-reference.	null
"mapType"	MapType	Type of the map	"system"
"markerColor"	Color	Defines the default color for custom markers. This color will be used if no color is provided in the configuration of a custom marker.	null
"markerIcon"	String	URL to an icon to use as a map marker	null
"markers"	Markers	Defines the list of markers for the map.	null
"minSearchCharacters"	Number	Defines the minimum number of characters required for the search to be performed.	0
"onRectChange"	String	Event which will get fired when the current zoomed rectangle changes.	null
"query"	String	Defines the name of the query (defined in the specified database table) which is executed to retrieve the content for the map layer.	null
"queryParams"	Array		null
"route"	Route	List of the waypoints for the route.	null
"routeColor"	String	Defines the color of the route line that is created from markers and displayed on the map.	null
"routeLatField"	String	Defnes the name of the database table's column that which retrieves the latitude for the routing point.	"lat"
"routeLineColor"	String	Defines the color of the line of the route that is created from markers (iOS only, for Android use routeColor)	"#1996fa"
"routeLineWidth"	Number	Defines thickness of the line of the route that is created from markers (iOS only).	3
"routeLonField"	String	Defnes the name of the database table's column that which retrieves the longitude for the routing point.	"lon"
"routeQuery"	String	Defines the name of the query (defined in the specified database table) which is executed to retrieve data for displaying a polyline object on the map.	null
"routeQueryParams"	Array	A list of query paramaters for displaying a route on a map layer.	null
"routeTable"	String	Defines the database table to display a polyline object on the map.	null
"searchEnabled"	Boolean	Defines whether the searching functionality is enabled for the map.	false
"searchHint"	String	Defines the search hint text that is displayed in the searching bar.	null
"searchSetting"	String	Defines the key for saving search in the _settings database table if saveSettings action is performed.	null
"searchType"	String	Defines how the parameters of the query used for searching are transferred.	"regex"
"selectedMarkerColor"	String	Defines the default color for the selected custom marker. This color will be used if no color is provided in the configuration of a custom marker.	null
"selectedMarkerIcon"	String	URL to an icon to use as a selected map marker	null
"showLocationAuthorizationAlert"	Boolean	Defines whether an 'alert' dialog window is shown if the user has not provided permissions for the app to use their location (iOS only).	true
"showPointsOfInterest"	Boolean	(iOS only) Defines wwhether points of interest such as shops, etc. are marked with a pin.	true
"showTraffic"	Boolean	Defines whether current traffic is shown.	false
"showUserLocation"	Boolean	Defines whether the user's position should be displayed on the map.	true
"styles"	String	Defines additional style or styles of the filter.	null
"table"	String	Defines the name of the database table that serves as the source for markers that are displayed on the map.	null
"transportType"	String	Defines the type of transport.	"none"
"valueMap"	ValueMap	List of the possible values that are using query results for it's configuration.	null
"visiblePaddingBottom"	String	Defines the bottom padding for the map.	null
"visiblePaddingLeft"	String	Defines the left padding for the map.	null
"visiblePaddingRight"	String	Defines the right padding for the map.	null
"visiblePaddingTop"	String	Defines the top padding for the map.	null
"zoomAnimated"	Boolean	Defines whether the initial zoom should be animated (iOS only).	null
"zoomControls"	Boolean	Defines whether the map should display zoom buttons (Android only).	null
"zoomOnUpdate"	Boolean	Determines if the map should change its zoom when the pins change.	true
"zoomedRadius"	Number	Defines the amount of meters from the center of zoomedRegions to the upper left point of the layer. Used for consistent zoom over both Android and iOS.	null
"zoomedRegions"	MapZoomedRegion	Defines the zoom of the map after loading.	"all"

Inherited

From Base Layer

Base Layer

Field Configurations

Key	Type	Description	Default Value
"_value"	Value	[PREVIEW] Dynamic value of the layer.	null
"accessibilityAppendState"	String	Defines this layer appends its state to the accessibility text.	null
"accessibilityText"	String	Text for accessibility navigation. Can be translated.	null
"actions"	ActionList	List of actions, which will be executed when the layer is tapped.	null
"borderColor"	Color	The color of the border in hex color value.	null
"borderRadius"	UnitSize	The radius applies to all corners; with a borderWidth of 0 the border is not drawn and radius is set anyway.	0
"borderWidth"	UnitSize	The width of the border.	0
"bottomLeftRadius"	UnitSize	Radius for the bottom left corner.	0
"bottomRightRadius"	UnitSize	Radius for the bottom right corner.	0
"classes"	Array	List of classes for layer styles.	null
"conditions"	Conditions	List of conditions to alter the layer state.	null
"constraints"	Constraints	A list of constraints defining the position of the layer in a layout.	null
"consumesKeyboard"	Boolean	This layer will be used to shrink, if a keyboard is shown.	null
"dataKey"	String	Name for assigning data to this layer.	null
"focusColor"	Color	The highlight color of this layer when it is focused. Mainly used on TV. If no color is provided, the pressedColor will be used.	null
"hidden"	Boolean	Indicates whether the layer is hidden. Default: false.	false
"isAccessibilityElement"	String	Defines if this layer is important for accessibility navigation. The default depends on the layer type.	null
"layerRotation"	Number	The layer is rotated by the specified degree.	0
"name"	String	Unique name in the layout. Used for alignment or actions.	null
"opacity"	Number	The opacity of the layer.	1
"overInsetBottom"	Boolean	Determines if this layer ignores the save space at the bottom of the device.	false
"overInsetTop"	Boolean	Determines if this layer ignores the save space at the top of the device.	false
"pressedColor"	Color	The highlight color of this layer when it is pressed. Mainly used on TV. If no color is provided, the focusColor will be used.	null
"safeArea"	SafeAreaTypeObject	Determines the safe area behaviour.	null
"shadowElevation"	Number	The elevation of this layer for casting shadows.	0
"state"	String	The state the layer will use as default.	"default"
"states"	LayerStates	A list of named states that affect the appearance of the layer.	null
"topLeftRadius"	UnitSize	Radius for the top left corner.	0
"topRightRadius"	UnitSize	Radius for the top right corner.	0
"touchFeedback"	TouchFeedback	Determines if the layer should show a touch feedback if touched.	"visible"
"trackingKey"	String	Defines a key for a scroll event.	null
"type"	LayerType	The type of the layer	null
"value"	Value	(Initial) value of the layer.	null

Examples

Example 1: Create a basic map

Goal: Creates a map with two markers, preselects the "Train Station" and displays a related message based on the marker with which the user has interacted.

To achieve this the following code can be used:

{
  "type": "map",
  "transportType": "auto",
  "markers": [
    {
      "text": "Bahnhof",
      "color": "#00ff00",
      "latitude": 50.579443,
      "longitude": 8.662399,
      "selected": true,
      "actions": [
        {
          "type": "showMessage",
          "params": {
            "text": "Bahnhof clicked"
          }
        }
      ]
    },
    {
      "text": "Kino",
      "color": "#ff0000",
      "latitude": 50.584207,
      "longitude": 8.679269,
      "actions": [
        {
          "type": "showMessage",
          "params": {
            "text": "Kino clicked"
          }
        }
      ]
    }
  ],
  "classes": [
    "fullSize"
  ]
}

The locations of the markers are specified by indicating the corresponding coordinates in latitude and longitude.

Result:

A map layer has been created