0

I am using EasyButton plugin of leaflet (link). More specifically I applied EasyBar which unites several buttons.
Plus, at certain zoom levels, I add/remove various layers with zoomend function (link). Is it possible to apply a function in which I can refer to BOTH button and zoom level? I don't know the formal code way but the idea something like the following:

  map.on('zoomend', onZoomend);
    function onZoomend(){
        if(map.getZoom()<8) else if btn2.enable(){}};

**and here is my code:

map.on('zoomend', onZoomend);
function onZoomend(){

    if(map.getZoom()<8)(){
    map.addControl(info0);
    map.removeControl(info1);       
    map.removeControl(info2);   
    map.removeControl(info3); 
}       

    if(map.getZoom()==8){
    map.addControl(info1);      
    map.removeControl(info2);   
    map.removeControl(info3);   
    }           };

1 Answer 1

1

I'm not well versed in Leaflet but it looks like you could use their DomUtil hasClass method to inspect whether or not the button has the 'enabled' or 'disabled' class present. Taking a look at the EasyButton github it looks like those classes get added when enable() or disable() is called, respectively.

Here are the enable() and disable() functions directly from the EasyButton GitHub:

enable: function(){
    L.DomUtil.addClass(this.button, 'enabled');
    L.DomUtil.removeClass(this.button, 'disabled');
    this.button.setAttribute('aria-hidden', 'false');
    return this;
  },

  disable: function(){
    L.DomUtil.addClass(this.button, 'disabled');
    L.DomUtil.removeClass(this.button, 'enabled');
    this.button.setAttribute('aria-hidden', 'true');
    return this;
  }

Using your example, it might look like this:

map.on('zoomend', onZoomend); function onZoomend(){ // Do something only if zoom is less than 8 AND button2 has the // 'enabled' class if(map.getZoom()<8) && L.DomUtil.hasClass(this.btn2,'enabled'){ // Your logic }};

It's worth noting that it looks like the 'enabled' and 'disabled' classes don't exist until either of the methods is called at least once.

5
  • Thank you @AHigh for your answer, but still not working... I tried with ---> else if (L.DomUtil.HasClass(btn2,'enabled'))
    – Gamze
    May 2, 2017 at 16:20
  • What was the result? The method is hasClass (lower-case 'h').
    – AHigh
    May 2, 2017 at 16:23
  • It crashes. I tried with corrected lower-case version too.
    – Gamze
    May 2, 2017 at 16:29
  • I've edited my answer, you might need to qualify the button class with a 'this'.
    – AHigh
    May 2, 2017 at 16:36
  • I agree with you the fact that it has to be something with "DomUtil hasClass method". Nevertheless, it still does not work with the edited version.
    – Gamze
    May 2, 2017 at 16:45

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.