I would like to click on a sidebar/menu icon, and when I do the layerswitcher Icon should appear.

enter image description here

Right now the layerswitcher is always displayed. I know how to make it disappear with the command

display: none !important;

I should establish a connection between the layerswitcher and the menu icon.

The menu works, so when I click their pops out a menu. The code of the sidebar menu in html is:

    <div id="side-menu" class="side-nav">
  <a href="#" class="btn-close"
  onclick="closeSlideMenu()">&times; </a>
  <a href="#">Building</a>
  <a href="#">about</a>
  <button class="dropdown-btn">
    bygning
  </button>
  <div class="dropdown-container">
    <a href="#">Link 1</a>
    <a href="#">Link 2</a>
    <a href="#">Link 3</a>
  </div>

</div>

It is connected to a click event in js, where the code is: function openSlideMenu(){ document.getElementById('side-menu').style.width = '150px'; } function closeSlideMenu(){ document.getElementById('side-menu').style.width = '0'; }

The js code of the layerswitcher is:

 var overlayMaps= "building": riskByg};
 var byg=L.control.layers(null, overlayMaps).addTo(map);

I assume it has something to do with the connection of my sidemenu in html. But right now I can only connect to a link, and I want to connect it to an icon.

Initially just define layer control, do not add it to the map:

var byg = L.control.layers(null, overlayMaps);

When you want to to show it, add it to the map

byg.addTo(map);

and when you want to hide it, remove it from the map:

byg.remove();
  • I have removed the layerswitcher function from the map. When I click the menu icon, i have made it possible to make the icon appear on the map. But I don't know how to remove it. my code is as follow: /* Open and close side bar */ function openSlideMenu(){ document.getElementById('side-menu',byg.addTo(map)).style.width = '150px'; } function closeSlideMenu(){ document.getElementById('side-menu').style.width = '0'; } – N.Juul 2 days ago
  • Just add byg.remove() call to your closeSlideMenu() function: closeSlideMenu(){document.getElementById('side-menu').style.width = '0';byg.remove();}. – TomazicM 2 days ago

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

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