Settings
The Settings panel controls how the map behaves — fullscreen, the hover tooltip, zoom and pan, deeplinking, and the responsive breakpoints below. The underlying keys are listed under Settings in the map data schema.
Options
| Name | Description |
|---|---|
| Fullscreen | Position of the fullscreen button (top-left … bottom-right). Click the selected arrow again to disable it. |
| Hover tooltip | Display a tooltip when hovering a location. |
| Hover about | Show the location’s about text in the hover tooltip. |
| Hover thumbnail | Show the location’s thumbnail in the hover tooltip. |
| Deeplinking | Enable direct links to map states via URL query parameters — focus a location, activate a group filter, or (with wayfinding on) from/to/fixedfrom routes. See Deeplinking. |
| Padding | Extra space around the map within the container, in pixels. |
| Scroll top | Offset in pixels for scrolling to the top when a location is focused in portrait mode — ideal for pages with a sticky header. |
Zoom and pan
Zooming and panning are controlled by a single master toggle — turn it off for a static map. When enabled, the following options appear:
| Name | Description |
|---|---|
| Max zoom | The map’s maximum zoom level; 1 is the fit scale, where the map fits the container. |
| Init area | The area the map focuses on at startup. Defaults to the full map. |
| Reset button | Position of the reset button, or click the selected arrow again to disable it. |
| Zoom buttons | Position of the +/− buttons, or click the selected arrow again to disable them. |
| Mousewheel | Allow zooming with the mouse wheel. On by default. |
| Shift key | Require holding Shift to zoom with the mouse wheel — prevents the map from hijacking the page’s scroll. |
| Close reset | Reset the zoom level when a location is unfocused. |
Breakpoints
Breakpoints make the map responsive by overriding the base layout at narrower widths — directory placement, sidebar width, list vs. grid, column count, height, and max zoom. They are managed in the Settings panel.
The base layout comes from the map’s own settings above. Each breakpoint overrides only the fields you set; the rest inherit the base value. Add a breakpoint for every narrower width that needs a different layout.
Options
| Property | Description |
|---|---|
| Class * | Unique name, applied as a CSS class for custom styling. |
| Below * | Upper width bound in pixels. Together with the next-lower breakpoint it defines the range these settings apply to. |
| Position | Place the directory in a side sidebar or below the map (portrait) — portrait is ideal for narrow screens. |
| Sidebar width | Width of the directory sidebar in pixels. Used with the sidebar position. |
| Type | Directory layout: list or grid. |
| Columns | Number of directory columns (default 1). |
| Container height | Fixed map container height in pixels. Auto by default. |
| Element height | Total map element height (container plus directory). Useful in portrait mode when a long directory needs to scroll. |
| Max zoom | Maximum zoom level for this width; 1 is the fit scale. |
Example
The base settings define the default layout — say a sidebar directory, list layout, 320px sidebar. Add one breakpoint for small screens:
- below 768px — portrait mode on, grid layout, 2 columns.
The narrower the map gets, the lower the breakpoint whose settings take effect. Widths wider than every breakpoint use the base settings.
See the Breakpoint schema and the Responsivity settings, and the Directory guide for the layout options these settings drive.