Map Styling

Markers & Icons

Customize how markers appear on your map.

Marker types

Mapsemble supports four marker types, controlled by the markerType setting:

  • Default — A standard colored pin marker. No additional configuration needed.
  • Icon — A custom icon wrapped in a pin shape. The icon source can be a URL or uploaded base64 data.
  • Image — Uses an image from a data field (e.g., a product photo). Set markerImageField to the field slug containing image URLs. Set markerDefaultImage to provide a fallback when the field is empty.
  • Text — Displays text from a data field inside the marker. Set markerField to choose which field supplies the text (defaults to label).

Marker source (icon type)

When using the Icon marker type, choose where the icon comes from via markerSource:

  • url — Load an icon from a URL. Set markerSourceUrl to the icon URL.
  • data — Use base64-encoded image data. Set markerDataUrl for the default state and markerDataUrlHover for the hover state.
  • field — Load the icon from a data field on each feature.

Marker styling options

Property Description Default
markerSizeY Height in pixels 40
markerAnchorY Vertical anchor point, 0 to 1. Controls where the marker "points" to on the map. 0.5
markerBorderColor Border color around the marker #ffffff
renderInPin Whether to wrap the icon in a pin shape. Set to false for a flat icon. true

Marker clustering

Group nearby markers into clusters to keep the map readable at low zoom levels.

Property Description Default
enableClustering Turn clustering on or off
clusterDistance Pixel distance threshold. Markers within this distance get clustered. 100
clusterFillColor Cluster circle background color #3399CC
clusterSize Cluster circle size in pixels 20

Remaining markers badge

Set showRemainingMarkers to display a count badge on clusters indicating how many markers are grouped together.

Marker offset

When multiple markers share the exact same location, they are slightly offset so all remain visible.

Property Description Default
markerOffsetEnabled Enable or disable the offset behavior true
markerMaxOffset Maximum offset distance in pixels 30

Plan availability

Marker customization is available on all plans, including Free.