Tooltip
Quick answer
L.tooltip shows a lightweight label anchored to a layer or coordinate, without a close button and without panning the map. Permanent tooltips label features in place, while sticky ones follow the cursor to report live positions. It also exposes setLatLng and setContent for runtime updates without rebinding.
L.tooltip( options , source ?) → Tooltip
Key points
- permanent true keeps the tooltip visible instead of hiding it on mouse out.
- sticky true re-anchors the tooltip to the pointer during mousemove only.
- direction accepts top, bottom, left, right or center, with auto avoiding viewport edges.
Example
var marker = L.marker([39.907359, 116.391263]).addTo(map);
marker.bindTooltip('天安门 · 客流 2.4 万/日', {
direction: 'top',
offset: [0, -14],
opacity: 1
});
/* 常驻提示：适合标注名称，不需要鼠标悬停 */
L.circleMarker([39.9147, 116.4106], { radius: 6, fillOpacity: 0.9 })
.bindTooltip('王府井', { permanent: true, direction: 'right', className: 'label-fixed' })
.addTo(map);
/* 跟随鼠标的要素提示 */
map.on('mousemove', function (e) {
tip.setLatLng(e.latlng).setContent(e.latlng.lat.toFixed(4) + ', ' + e.latlng.lng.toFixed(4));
});
var tip = L.tooltip({ sticky: true }).openOn(map);Notes
- A permanent tooltip can intercept touch taps, so keep interactive false and disable pointer events.
- Tooltips never auto pan, so content near the viewport edge may be clipped.
English edition written for Atlaslog. Code is taken from the original Chinese page and runs unchanged.
Atlaslog (2026). Tooltip. https://www.jingweizhi.com/en/leaflet/api/tooltip.html (accessed 2026-11-03).