[GIS] Collapse leaflet control

leaflet

I want to collapse a leaflet control on my map. I have the current code:

    var legend = L.control({position: 'bottomright', collapsed:true});

    legend.onAdd = function (map) {
    var div = L.DomUtil.create('div', 'info legend');
    div.innerHTML = "<h6>DISCLAIMER:<br>text</h3><table></table>";
        return div;
    };
    legend.addTo(map);

But I still cannot get it to collapse or appear on hover like my layers selection does. How do I need to adjust my code? I have visited the Leaflet examples but it seems like the collapse feature is only for layer elements and not simply for a control.

Best Answer

I don't think collapsed:true is going to make sense in this context, as there isn't a legend control in Leaflet that is analogous to the layer control (L.control.layers).

Similar to the layer control, you could construct a div with an icon that always shows by default, with the legend hidden by default, but positioned to hide the icon div when visible.

Then with javascript/jQuery, show the legend on hover:

$('#legend-icon-div).hover(
  function() {
    $('#legend').show();
  }, function() {
    $('#legend').hide();
  }
)
Related Question