Leaflet.Control.Layers.Tree
Leaflet.Control.Layers.Tree copied to clipboard
Request - use click instead of hover to open/close the control
At present, the control is opened/closed using mouseover
/mouseout
events.
This makes it difficult to operate by users with some disabilities and/or assistive technology.
Can you provide an option to open/close this control using mouse-click and/or keyboard?
This control tries to behave like "Control.Layers" control (https://leafletjs.com/reference-1.7.1.html#control-layers). As far as I know, there is no such a feature in Leaflet.
However you can capture the events in the DOM, and call the expand()
and collapse()
methods (probably using also the option collapsed
in the control creation)
Basically:
var layerControlTree = L.control.layers(base, tree, {collapsed: false}).addTo(map);
var collapsed = false
$('.leaflet-control-layers').on('click', () => {
if (collapsed)
layerControlTree.expand();
else
layerControlTree.collapse();
collapsed = !collapsed
});