Skip to content
This repository has been archived by the owner on Mar 28, 2022. It is now read-only.

Labels don't disappear on mobile platforms. #114

Open
dwkns opened this issue Apr 22, 2015 · 4 comments
Open

Labels don't disappear on mobile platforms. #114

dwkns opened this issue Apr 22, 2015 · 4 comments

Comments

@dwkns
Copy link

dwkns commented Apr 22, 2015

There is no hover in mobile Safari. Labels appear when a marker is clicked.

They disappear if you tap on a map, however if you directly tap on another marker a new label opens and the existing one doesn't close.

Is there any way of closing existing labels when a new one opens?

@aowal
Copy link

aowal commented May 12, 2015

Did you find any solution to this ?
I have been experiencing the same problem with touch devices.The label does not destroy when a new polygon is touched.

@dwkns
Copy link
Author

dwkns commented May 13, 2015

No, as I understand it, each marker and therefore label doesn't have a reference to all the other markers on your map.

For desktop this doesn't matter because there is a mouseout event, which causes the current label to close. I don't believe there is an equivalent for touch.

In your app, if you maintain an array of all your markers you should be able to call the .hideLabel method on them before you open a new one. It would mean hacking

src/BaseMarkerMethods.js

to contain something like :

_addLabelRevealHandlers: function () {
        this
            .on('mouseover', this.showLabel, this)
            .on('mouseout', this.hideLabel, this);

        if (L.Browser.touch) {

            // loop through all the markers and close their labels.
            yourMarkerArray.forEach(function(marker) {
               marker.hideLabel;
            });

            this.on('click', this.showLabel, this);
        }
    }

That said I've not tested it, so good luck.

I'd probably settle for being able to turn off labels for touch.

@MattSidor
Copy link

+1 for this issue, I am going to have to create a similar workaround for our mobile users. It would be great if Leaflet.label had some kind of built-in functionality for touchscreen interactions.

@jdgodchaux
Copy link

In lieu of a fix to this library, one possible solution is to use L.Browser.touch to test for touch device support, and then bind a Leaflet popup for touch browsers and labels for non-touch browsers.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants