Building custom toolbars

Leaflet.toolbar is designed to be easily extended.

Library and plugin designers may want to provide application developers with simple toolbars exposing their plugins to users. Leaflet.toolbar makes this as easy as subclassing L.Toolbar2.Control or L.Toolbar2.Popup.

Note that toolbar actions should subclass L.Toolbar2.Action, which provides defaults for the action's sub-toolbar and toolbar icon and includes private methods for constructing the toolbar icon.

When application developers using leaflet-draw-toolbar instantiate a toolbar to expose drawing functionality to users, they need only write

new L.Toolbar2.DrawToolbar().addTo(map);

If application developers wish to change the actions exposed to the user, they may do so easily when the toolbar is instantiated.

new L.Toolbar2.DrawToolbar({ actions: [L.Toolbar2.DrawAction.Marker]} ).addTo(map); // only allow users to create markers.

Examples

See leaflet-draw-toolbar and Leaflet.DistortableImage, as well as the examples directory of Leaflet.Toolbar.

L.Toolbar2

Library developers wishing to create toolbar interfaces that are drastically different from either a popup-style or a control-style toolbar may subclass the abstract class L.Toolbar2. Any toolbar class extending L.Toolbar2 must implement #onAdd and #onRemove. The #onAdd method should call L.Toolbar2#appendToContainer with a DOM Node to contain the toolbar.