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 applying different layout settings at different sizes — directory placement, sidebar width, list vs. grid, column count, and height. They are managed in the Settings panel.
Every map has a default all-screens breakpoint that supplies the base layout; its class cannot be renamed. Add more breakpoints for narrower widths.
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. |
| Portrait | Place the directory below the map instead of in a side sidebar — ideal for narrow screens. |
| Sidebar | Width of the directory sidebar in pixels. Used when Portrait is off. |
| Type | Directory layout: list or grid. |
| Column | Number of directory columns (default 1). |
| Container | Fixed map container height in pixels. Auto by default. |
| Element | Total map element height (container plus directory). Useful in portrait mode when a long directory needs to scroll. |
Example
A typical setup uses one extra breakpoint for small screens:
- all-screens — sidebar directory, list layout, 320px sidebar.
- below 768px — portrait mode on, grid layout, 2 columns.
The narrower the map gets, the lower the breakpoint whose settings take effect.
See the Breakpoint schema and the Responsivity settings, and the Directory guide for the layout options these settings drive.