Locations

The primary elements for constructing an interactive map are locations. Mapplic maps offer the flexibility of an unlimited number of locations, each with its own set of properties.

Location properties

Locations come with built-in properties, organized into the same sections as the panel: Content, Preset, Visual, Filtering, Action, Position, and Custom.

By default a location opens in a simplified view showing the ID, the Content fields, and the Preset section. The Show more button at the bottom of the panel expands the detailed view with the remaining sections; Show less returns to the simplified list.

The list of locations can be reordered using drag-and-drop.

Content

Preset

Inherited values are listed in this section for reference; any value the location overrides is dimmed. Options set directly on the location are collected in an Options box with Add to preset and Create preset actions — see Presets.

Visual

The marker-related fields are hidden while Marker is off.

Filtering

Action

The action decides what happens when a location is focused — usually opening a popup with the location’s details and media.

Action values

Popup types

The popupType and action values are also listed in the Enums reference.

Position

Custom

Custom attributes attach your own data to locations — see Custom fields below.

Custom fields

Beyond the built-in location properties (title, image, link, and so on), custom fields attach extra data to locations — an internal ID, a capacity, an accessibility flag, or anything else a map needs.

Adding a field

Open a location and expand the Custom section, then choose New custom field. Enter a key using only lowercase letters, hyphens, and underscores (no spaces or other characters), for example poi-id or wheelchair_access.

Once added, the field becomes available on every location — fill in a value per location as needed. Custom fields can also be set on a preset so locations inherit a shared value.

Removing a field

Use the minus button next to a field to remove it. A field is only removed once no location still has a value for it, so clear the values first for a clean removal.

Using custom fields

Custom fields aren’t shown in popups on their own, but they power several other features:

• Template variables — render a field inside About or Description with {{ key }}. See template variables.
• Filter conditions — reference a field in a checkbox, dropdown, or chips filter condition, such as l.country === value.

This makes custom fields a flexible way to drive filtering and personalized content from your own data.

Styles

Styles enable advanced customization of markers and interactive SVG elements. While the color property covers basic tinting, a style lets you define distinct colors for the base, hover, and active states, control strokes and label text, and add visual effects.

Create styles from the Styles list at the bottom of the Locations panel, or straight from a location’s Style field. Once defined, assign a style with the style property (markers and SVG elements) or the markerStyle property (markers only).

Applying a style

Each style starts with three settings that decide what it targets.

States

A style is configured across three states, each in its own accordion. The Hover state is also applied to locations matched by a filter.

Effects

Effects add depth and motion to a state. Shadows and glows are mutually exclusive with one another, as are the Grow, Pulse, and Shake animations.

Dark mode

Every color field (fill, stroke, and text) accepts a separate dark value that is used when the map runs in dark theme. Each dark variant is stored under a _dark suffix, for example base-color_dark. Leave it blank to reuse the light color.

Custom CSS hook

Because the style class is added to the marker or element as a CSS class, it doubles as a hook for custom CSS. For example, to make the stroke dashed on the active state only:

.my-style-class.mapplic-active {
    stroke-dasharray: 2 2;
}

See the Style schema for the complete list of keys.

Presets

Presets are reusable location templates. When several locations share the same options — a style, a marker color, a popup configuration — define them once on a preset and reference it from each location. Any change to the preset updates every location that uses it at once.

A preset has the same properties as a regular location. When a location references a preset, the preset’s values are inherited; any value set directly on the location overrides the inherited one.

The default preset

Every map has a built-in Default preset (id def). Locations that don’t reference a custom preset inherit from it, so the Default preset is the place to set map-wide defaults such as a base marker color or popup type.

Creating a preset

There are two ways to create a preset:

• From the Preset field — open any location, find the Preset dropdown in the Preset section, and choose Create. The new preset is created and immediately assigned to that location.
• From the Presets list — in the Locations panel, scroll to the Presets section and add a new preset from the list header.

Each preset in the list shows a counter of how many locations currently use it.

Editing a preset

Click any preset in the Presets list to open it — it exposes the same Content, Visual, Filtering, and Action options as a location. From a location that has a preset assigned, choose Edit on the Preset field to jump straight to it.

In the location’s Preset section, inherited values are listed for reference; any field the location overrides is dimmed.

Moving options into a preset

To reuse settings configured directly on a location, the Options box in the Preset section promotes them:

• Create preset turns the location’s own options into a brand-new preset.
• Add to preset merges them into the preset the location already references.

In both cases the options move off the location and onto the preset, so they become shared inherited values.

Presets pair well with template variables and are described in the Presets schema.

Clustering

On maps with many markers, points overlap and crowd each other — especially at lower zoom levels. Crowding controls how Mapplic resolves that overlap. It is set per location in the Visual section, but is most often applied through the Default preset so the whole map behaves consistently.

Modes

The default mode applies no crowding. Whatever the mode, all markers are revealed once the map is zoomed in to its maximum level.

Clusters

With the Cluster mode, overlapping markers below max zoom are replaced by a single marker showing the count of points it represents. Clicking a cluster zooms the map in toward it, progressively revealing the individual markers as they stop colliding.

At runtime a cluster marker carries a clusterCount and the list of members it groups — see the Location schema.

Recognizer

To simplify the process of populating locations, Mapplic includes a built-in feature known as the recognizer. This feature iterates through all interactive elements of an SVG and automatically places empty locations at estimated positions based on the bounding box of each element.

The recognizer operates on the selected layer, meaning it needs to be executed individually for each layer.

CSV import

Spreadsheets are one of the most intuitive ways to manage tabular data, so Mapplic can load locations from a CSV source in addition to its built-in data. Locations can live entirely in a CSV, mix CSV and built-in entries, or be exported to CSV for bulk editing and re-imported.

Open the Locations panel and enable External CSV to reveal the options below.

CSV format

The header row holds location property keys (id, title, coord, group, …) and each following row is one location. The id column is required so locations can be matched and linked to SVG elements.

Linking a source

Locations that exist only in the CSV appear below the built-in locations as inactive entries. Import a single one from there, or import them all at once.

Importing

The Import button pulls every CSV location into the map’s built-in data and then unlinks the source (it clears the csv path and turns External CSV off). With Merge selected, fields from a matching CSV row overwrite the internal location; CSV-only rows are added as new locations.

Exporting

The Export button downloads the current locations as a CSV file. This is the easiest way to make bulk edits: export, edit in a spreadsheet, then link or re-import the file.

See the CSV settings for the related configuration keys.

Template variables

Achieving personalized about and description properties for a location is made easy through the use of template variables.

Any location property (default or custom) can be rendered by putting it inside {{ }} brackets.

Welcome to our office in {{title}}.
Feel free to reach out.
Phone: {{phone}} 
Email: {{email}}

The above description template will pull in the title, phone and email attributes of the location. This feature is extremely useful when combined with presets.