Marker
Used to put markers on the map.
L.marker([50.5, 30.5]).addTo(map);
Creation
Factory |
Description |
L.marker(
<LatLng> latlng,
<Marker options> options? )
|
Instantiates a Marker object given a geographical point and optionally an options object. |
Options
Option |
Type |
Default |
Description |
icon |
L.Icon |
* |
Icon class to use for rendering the marker. See Icon documentation for details on how to customize the marker icon. Set to new L.Icon.Default() by default. |
clickable |
Boolean |
true |
If false , the marker will not emit mouse events and will act as a part of the underlying map. |
draggable |
Boolean |
false |
Whether the marker is draggable with mouse/touch or not. |
keyboard |
Boolean |
true |
Whether the marker can be tabbed to with a keyboard and clicked by pressing enter. |
title |
String |
'' |
Text for the browser tooltip that appear on marker hover (no tooltip by default). |
alt |
String |
'' |
Text for the alt attribute of the icon image (useful for accessibility). |
zIndexOffset |
Number |
0 |
By default, zIndex for the marker image is set automatically based on its latitude. Use this option if you want to put the marker on top of all others (or below), specifying a high value like 1000 (or high negative value, respectively). |
opacity |
Number |
1.0 |
The opacity of the marker. |
riseOnHover |
Boolean |
false |
If true , the marker will get on top of others when you hover the mouse over it. |
riseOffset |
Number |
250 |
The z-index offset used for the riseOnHover feature. |
Events
You can subscribe to the following events using these methods.
Event |
Data |
Description |
click |
MouseEvent |
Fired when the user clicks (or taps) the marker. |
dblclick |
MouseEvent |
Fired when the user double-clicks (or double-taps) the marker. |
mousedown |
MouseEvent |
Fired when the user pushes the mouse button on the marker. |
mouseover |
MouseEvent |
Fired when the mouse enters the marker. |
mouseout |
MouseEvent |
Fired when the mouse leaves the marker. |
contextmenu |
MouseEvent
| Fired when the user right-clicks on the marker. |
dragstart |
Event |
Fired when the user starts dragging the marker. |
drag |
Event |
Fired repeatedly while the user drags the marker. |
dragend |
DragEndEvent |
Fired when the user stops dragging the marker. |
move |
Event |
Fired when the marker is moved via setLatLng. New coordinate include in event arguments. |
add |
Event |
Fired when the marker is added to the map. |
remove |
Event |
Fired when the marker is removed from the map. |
popupopen |
PopupEvent |
Fired when a popup bound to the marker is open. |
popupclose |
PopupEvent |
Fired when a popup bound to the marker is closed. |
Methods
Method |
Returns |
Description |
addTo(
<Map> map )
|
this |
Adds the marker to the map. |
getLatLng() |
LatLng |
Returns the current geographical position of the marker. |
setLatLng(
<LatLng> latlng )
|
this |
Changes the marker position to the given point. |
setIcon(
<Icon> icon )
|
this |
Changes the marker icon. |
setZIndexOffset(
<Number> offset )
|
this |
Changes the zIndex offset of the marker. |
setOpacity(
<Number> opacity )
|
this |
Changes the opacity of the marker. |
update()
|
this |
Updates the marker position, useful if coordinates of its latLng object were changed directly. |
getPopup() |
Popup |
Returns the popup previously bound by the bindPopup method. |
toGeoJSON() |
Object |
Returns a GeoJSON representation of the marker (GeoJSON Point Feature). |
Interaction handlers
Interaction handlers are properties of a marker instance that allow you to control interaction behavior in runtime, enabling or disabling certain features such as dragging (see IHandler methods). Example:
marker.dragging.disable();
Property |
Type |
Description |
dragging |
IHandler |
Marker dragging handler (by both mouse and touch). |