Leaftet issues L.easybutton duplicating

Viewed 35

I am having an issue where I'm pulling data into a Modal using leaflet L.easybutton. I only want information on the selected country at the time to appear in the modal. However, when clicking on different countries, multiple modal buttons are being created when I only want the one button and the information in that modal to change when another country is selected.

Link to my Github https://github.com/HuzaifahLunat/map/tree/main/gazetteerprojectresponsivemodal1

See the issues on my website - https://huzaifahlunat.co.uk/gazetteerprojectresponsivemodal1

I was recommended to add this code by someone else on line 263 -

if(myEasyButton){
                    mymap.removeControl(myEasyButton);
    }
    
    myEasyButton = L.easyButton('<i class="material-icons icon">info</i>', () => {DisplayGeneralInfo()}); 
    
    myEasyButton.addTo(mymap);

instead of the code that was already there being -

 L.easyButton('<i class="material-icons icon">info</i>', () => {DisplayGeneralInfo()}).addTo(mymap);

When adding this code, the L.easy button didn't show up at all. My guess is due to the if statement removing the control entirely.

Thanks for any help below

0 Answers
Related