Map

Map

Add a map to the view.

th

Component Properties

Dimensions — The placement on the canvas (X and Y) and the size (width and height) of the component.

To move a component freely, the View Property tab must have the Free Positioning option checked.

Data

Coordinates — Select an input for the map’s coordinates. Inputs are configured in the View Property tab.

Default Location — Enter a place, for instance a city or country, as the default map location.

Zoom — Select a value as the initial zoom level.

Draggable — Select this box to allow the user to move around the map by dragging.

On Region Change — Select the event when the map changes region.

On Drag — Select the event when the map is dragged.

On Drag Start — Select the event when a map drag is started.

On Drag End — Select the event when a map drag is ended.

On Focus — Select event when the map gets focus.

On Blur — Select event when the map loses focus

Hide Component — The map can be hidden by applying a rule on a certain event.

Output

Coordinates — Select the output to send coordinates to. Outputs are configured under the View Properties tab.

Accessibility

Accessibility Label — Interface Accessibility label.

Accessibility Hint — Interface Accessibility hint.

Accessibility Role — Select an accessibility role, a function, for the component, to support disabled users.

Styling

Override — Override the currently selected style.

Pin Color — Sets the color of the marker pin.

Background Color — Sets the background color of the component.

Background Image — Select an image as the component’s background.

Background Size — Select if the image should cover the component’s background, be centered, repeated or stretched.

Component Width — The width of the component inside the container (the component’s borders).

Component Height — The height of the component inside the container (the component’s borders)

Flex Direction — Select the main axis where flex items will be placed, for instance horizontal or vertical (along a row or in a column).

Justify Content — Select how flex items will be placed in relation to each other, for instance towards the start of the flex direction, or with space between.

Align Content — Select how flex items will be placed in relation to the components border.

Align Items — Select how flex items will be placed in relation to the flex direction.

Border Top Color — The color of the component’s top border.

Border Top Width — The width of the component’s top border.

Border Bottom Color — The color of the component’s bottom border.

Border Bottom Width — The width of the component’s bottom border.

Border Left Color — The color of the component’s left border.

Border Left Width — The width of the component’s left border.

Border Right Color — The color of the component’s right border.

Border Right Width — The width of the component’s right border.

Border Top Left Radius — Sets the rounding of the top left corner.

Border Bottom Left Radius — Sets the rounding of the bottom left corner.

Border Top Right Radius — Sets the rounding of the top right corner.

Border Bottom Right Radius — Sets the rounding of the bottom right corner.

Border Radius (All) — Sets the rounding of all corners.

Border Style — Sets the style, solid, dotted or dashed, of the component’s border.

Shadow — Adds a shadow to the component’s borders.

Opacity — Sets the opacity of the component.

Component Padding — Sets the padding, top, bottom, left, right of the component inside the container (the component’s borders).

Component Container Padding — Sets the padding, top, bottom, left, right of the component container (the component’s borders).