Search code examples
javascriptleaflettooltipclose-button

Tooltip with click button to close -Leaflet

I want to display a tooltip with a close button on the page with instruction.when the page load tooltip should be there with close button so after reading instruction person can close the tooltip.currently with this code I manage to load tooltip but I would like to add a close button like the popup to close the tooltip. How I can add this?

 var tooltip = L.tooltip({
    direction: 'center',
    permanent: true,
    interactive: true,
    noWrap: true,
    opacity: 0.9
    });
    tooltip.setContent( "instructions" );
    tooltip.setLatLng(new L.LatLng(23.951,149.861));
    tooltip.addTo(map);
Solution

  • The OP asked in the comments, how to disable closeing when clicking on map or popup:

    You can use the option closeOnClick: false Doc:

    var popup = L.popup({closeOnClick: false, closeButton: true, autoClose: true, closePopupOnClick :false })
.setLatLng([20.951,149.861]) 
.setContent("intro") 
.openOn(map);