Map Component

The Map component displays an interactive choropleth or marker map from module data using the Highcharts map library. Data series are bound to geographic regions or coordinates using configurable inputs.

How to read settings tables

The tables below describe each configurable option as it displays in the Unqork IDE. Values are formatted as follows: inline code — a value to type exactly as shown | Bold — a value selected from a drop-down, radio button, tab, or choice chip | ON/OFF — toggle state | ✓ — checkbox checked | ☐ — checkbox unchecked

General Settings

Setting	Field	Type	Default	Description
Property ID	`key`	Text input	`map`	The unique identifier for this component instance.

Display Settings

Field Text

Setting	Field	Type	Default	Description
Label Text	`label`	Text input	—	Identifies the component on the canvas.

Formatting

Setting	Field	Type	Default	Description
Chart Title	`mapData.chartTitle`	Text input	—	A title displayed inside the map.
Chart Subtitle	`mapData.chartSubtitle`	Text input	—	A subtitle displayed below the map title.
Chart Height (in px)	`mapData.height`	Text input	`300`	The map height in pixels.
Series Label Format	`mapData.labelFormat`	Text input	`{point.y:,.0f}`	Highcharts format string for data point labels.
Tooltip Format	`mapData.tooltipFormat`	Text input	`{series.name}:{point.y:,.0f}`	Highcharts format string for the tooltip on hover.

Actions Settings

Inputs

Defines each data series to plot on the map.

Column	Field	Description
ID	`id`	The module field providing data for this series.
Label	`seriesLabel`	The display label for this series.
Map	`mapType`	The map type or geographic region to use.
key Type	`keyType`	The type of key used to match data to map regions.

Event Output

Defines module fields populated when an end-user interacts with a map region.

Column	Field	Description
ID	`id`	The module field to populate with the selected region value.
Filter Category	`filterCategory`	The category to filter on when a region is selected.

Advanced Settings

Additional Styling

Setting	Field	Type	Default	Description
Show Legend	`mapData.showLegend`	Toggle	OFF	Displays a color legend for the map.
Customize Colors	`mapData.formatColors`	Toggle	OFF	Enables custom color range configuration for the map.
↳ Minimum Color	`mapData.minColor`	Text input	—	The hex color for the minimum value in the range (for example, `#efecf3`). Visible when Customize Colors is ON.
↳ Minimum Value	`mapData.minColorValue`	Text input	—	The data value mapped to the minimum color. Leave empty to auto-calculate. Visible when Customize Colors is ON.
↳ Maximum Color	`mapData.maxColor`	Text input	—	The hex color for the maximum value in the range. Visible when Customize Colors is ON.
↳ Maximum Value	`mapData.maxColorValue`	Text input	—	The data value mapped to the maximum color. Leave empty to auto-calculate. Visible when Customize Colors is ON.
↳ Use Log Scale for Color Gradient	`mapData.logColor`	Toggle	OFF	Applies a logarithmic scale to the color gradient to prevent outliers from dominating the color range. Visible when Customize Colors is ON.
Enable Find Replace	`mapData.applyFindReplace`	Toggle	OFF	Enables a value mapping table to find and replace data values before plotting.

Mappings (visible when Enable Find Replace is ON)

Column	Field	Description
Find	`find`	The value to search for in the data.
Replace	`replace`	The value to substitute in its place.

Changelog

Date	Change
—	Initial publication.

Documentation Index