CODEWITHSUNDEEP
javascriptleaflet
Furtiro
Furtiro

Reputation: 449

Leaflet : Remove EasyButton Control from leaflet map

I have a leaflet map where I display tons of markers, and an easybutton control that I add sometimes on my map. When the user click on it I want to remove it from the map. But when I click on it there is always an error from easybutton.js : ' TypeError: this._map is null '. This error freez my page on IE...

This is my code when I add my control and the event onclick on it where I want to remove it.

 backButton = L.easyButton('<span class="backButton">&larrhk;</span>', function (btn, map) {

                //evenement on click button


                map.removeControl(backButton);



            },
            { position: 'bottomright' });

            map.addControl(backButton);

I tested with "this" and "btn" instead of backButon in map.removeControl() but same error . I also tested with backButton.removeFrom(map) ..

Thanks

Upvotes: 1

Views: 3013

Answers (2)

IvanSanchez
IvanSanchez

Reputation: 19069

While inside the event handler function, the button can be acessed as this, so it's as simple as map.removeControl(this); or this.remove();.

However, the code for easyButton tries to access the map just after the button is clicked, so a better approach is to wait one frame to remove it. See this working example.

Upvotes: 6

HudsonPH
HudsonPH

Reputation: 1868

I belive is better you just disable your button or hide, beacuse if you remove the button everthing the button do on the map will be removed, so try this :D

backButton.disable()?

the last example: http://danielmontague.com/projects/easyButton.js/v1/examples/

or just set a id in your button and use this: $("#MyID").hide()

Upvotes: 0

Related Questions