Skip to main content

Markers

Description​

The following are examples of usage of markers. You can add a marker to the map using the addTo() method. To work with a group of markers, use FeatureGroup: see the Processing events of the group of markers and Displaying multiple markers and adjustment of boundaries sections. For more information about markers, see the Markers section.

Marker with a popup​

To add a marker, clicking on which opens a popup with the information:

Draggable marker​

To add a marker, which users can drag and drop:

A marker with a custom icon​

You can specify a custom icon or a simple div element for the marker instead of an image:

Opening a marker programmatically​

To open a popup by clicking on a link or button:

Marker with a tip​

The marker has two types of tips: regular and static. Example of using both types:

Processing events of the group of markers​

When clicking on the marker, the map will be centered in its position:

Animated movement of a marker​

An example of a marker that moves along a given trajectory:

Displaying multiple markers and adjustment of boundaries​

Example of displaying and hiding a group of markers with automatic detection of map boundaries: