I am using leaflet and I have a few markers. If I hover on the marker icon its tooltip automatically opens, showing the related data. I have my markers stored inside a variable called woMarkers and everything works using it except this feature. If I do something like this:

$(woMarkers[0]._icon).hover();

then nothing happens, no error and the tooltip does not open. These are the options I am using:

        var woOptions = {
            fitBounds: true,
            enableLandmarkLink: false,
            reDrawBounds: true,
            showControls: true,
            getName: function(record) {
                return record[('Job Number' in record ? 'Job Number' : 'Name')];
            },
            markerIconTemplate: '<div class="fi-marker-container %6" data-workorder="%3"><a class="icon" style="color: %4;">%1%2</a></div><div class="fi-marker-pointer-container"><div class="fi-marker-pointer %6"></div></div>',
            markerSelection: true,
            displayLabels: mapLabels,
            additionalMarkerMarkup: {
                column: 'Status', /* Display additional Marker html pending on a column value */
                values: {
                    '1': '<img class="top-right-icon" src="/Images/Icons/Help.png" />',
                    '2': '<img class="top-right-icon" src="/Images/Icons/CheckCircle.png" />',
                    '3': '<img class="top-right-icon" src="/Images/Icons/CheckCircle.png" />',
                    '4': '<img class="top-right-icon" src="/Images/Icons/CheckCircle.png" />',
                    '5': '<img class="top-right-icon" src="/Images/Icons/Warning.png" />'
                },
                columns: ["Workorder #"]
            },
            layer: new L.LayerGroup()
        };

So, my question is as follows: If I have a marker object, how can I programmatically open its tooltip?

I am using leaflet and I have a few markers. If I hover on the marker icon its tooltip automatically opens, showing the related data. I have my markers stored inside a variable called woMarkers and everything works using it except this feature. If I do something like this:

$(woMarkers[0]._icon).hover();

then nothing happens, no error and the tooltip does not open. These are the options I am using:

        var woOptions = {
            fitBounds: true,
            enableLandmarkLink: false,
            reDrawBounds: true,
            showControls: true,
            getName: function(record) {
                return record[('Job Number' in record ? 'Job Number' : 'Name')];
            },
            markerIconTemplate: '<div class="fi-marker-container %6" data-workorder="%3"><a class="icon" style="color: %4;">%1%2</a></div><div class="fi-marker-pointer-container"><div class="fi-marker-pointer %6"></div></div>',
            markerSelection: true,
            displayLabels: mapLabels,
            additionalMarkerMarkup: {
                column: 'Status', /* Display additional Marker html pending on a column value */
                values: {
                    '1': '<img class="top-right-icon" src="/Images/Icons/Help.png" />',
                    '2': '<img class="top-right-icon" src="/Images/Icons/CheckCircle.png" />',
                    '3': '<img class="top-right-icon" src="/Images/Icons/CheckCircle.png" />',
                    '4': '<img class="top-right-icon" src="/Images/Icons/CheckCircle.png" />',
                    '5': '<img class="top-right-icon" src="/Images/Icons/Warning.png" />'
                },
                columns: ["Workorder #"]
            },
            layer: new L.LayerGroup()
        };

So, my question is as follows: If I have a marker object, how can I programmatically open its tooltip?

• javascript
• jquery
• leaflet

• For the tooltip, do you use Leaflet.label plugin or Leaflet 1.0 built-in L.tooltip / marker.bindTooltip? – ghybs Commented Sep 30, 2016 at 11:17
• @ghybs, I do not know. How can I check which one is used? – Lajos Arpad Commented Sep 30, 2016 at 11:21

2 Answers 2

You could simply use marker.fire("mouseover"), using Leaflet built-in event management methods.

Demo: https://jsfiddle/3v7hd2vx/92/

In case you are using the Leaflet Tooltip, you can open it by calling:

marker.openTooltip();

See documentation.