[GIS] Dynamic tooltip update leaflet

leaflet

How can I make my tooltips update when I change years on this map?

http://argis.ualr-iea.org/dash_new_design/uninsured_map.html

Using the select box, I can get the style to change but I can't figure out how to update the numbers in the tooltip.

Best Answer

Use the setToolTipContent() method. See the documentation here (it's hidden in the expandable part of the documentation "Tooltip methods inherited from Layer")

Related Solutions

[GIS] Overriding Leaflet tooltip style

The L.Tooltip class includes a className option (inherited from the DivOverlay class), which will be converted into a CSS class when the tooltip is displayed. e.g.:

L.marker(latlng).addTo(map).bindTooltip('Text', {className: 'myCSSClass'});

Then, it's just a matter of defining that CSS class. The tip is a bit tricky, as it needs working with pseudo-elements and leaflet CSS classes:

.myCSSClass {
  background: green;
  border: 2px solid cyan
}
.leaflet-tooltip-left.myCSSClass::before {
  border-left-color: cyan;
}
.leaflet-tooltip-right.myCSSClass::before {
  border-right-color: cyan;
}

See a working example here.

[GIS] Leaflet tooltip classname not applying

Use className instead of classname. Remember to check the Leaflet documentation for the right spelling. Stuff in javascript is case-sensitive, and most of the time you won't get any warnings about that.

Best Answer

Related Solutions

[GIS] Overriding Leaflet tooltip style

[GIS] Leaflet tooltip classname not applying

Related Question