Beautiful Maps - Mapbox
  • Introduction
    • 👋Welcome
    • Key use cases
    • Key features
    • Demo apps
  • Getting Started
    • Registering for a Mapbox account
    • Install the plugin
    • Adding the access token
    • Adding a map to your app
  • Loading a Map
    • Selecting a default location
    • Setting zoom levels
    • Setting a map style
    • Adding controls to a map
  • Loading Markers
    • Structuring your database for markers
    • Adding multiple markers
    • Adding a single marker
    • Adding popups to markers
    • Using custom icons
    • Changing marker on hover
    • Removing markers from a map
    • Trigger an action when marker is clicked
  • Geolocation
    • Show the user's current location
  • Drawing Mode
    • Drawing shapes on a map
    • Saving drawings
    • Loading drawings
  • Route Navigation
    • Adding navigation
Powered by GitBook
On this page
  1. Loading Markers

Changing marker on hover

PreviousUsing custom iconsNextRemoving markers from a map

Last updated 3 months ago

You can add a list of markers that will be shown when the default marker is hovered by using the field that comes with the 'Add List of Markers Map To Mapbox Map' action:

In the above example, we've added an image field called 'Image - Hover State' to our 'Location' data type that we're referencing in the 'Icon Image (Multiple)' field:

However, you can also use one image for all hover images by using the 'Icon Image (Single)' field in the 'Add List of Markers' action - see the video tutorial below for full details.

Video tutorial

The below video tutorial shows how you can add change a marker icon when hovered: