How to click a button and start a new polygon without using the Leaflet.draw UI

Question

What I'm struggling with is how to click a button and start a new polygon without using the Leaflet.draw UI. e.g. ``` $('#draw_poly').click(function() { }); ``` I'm able to put an existing polygon into edit mode no problem. ``` $('.edit_polygon').click(function() { var name = $(this).text(); geojson_layer.eachLayer(function (layer) { if (name == layer.feature.properties.name){ layer.editing.enable(); } }); return false; }); ``` Thanks to Jacob Toye for assistance. I've made a little demo. ``` Button click

Accepted Answer

To start drawing a shape is very straight forward. You create a handler for the type of shape you want and then enable that handler.

E.g. for drawing a polyline you would do:

```
// Define you draw handler somewhere where you click handler can access it. N.B. pass any draw options into the handler
var polygonDrawer = new L.Draw.Polyline(map);

// Assumming you have a Leaflet map accessible
map.on('draw:created', function (e) {
    var type = e.layerType,
        layer = e.layer;

// Do whatever you want with the layer.
    // e.type will be the type of layer that has been draw (polyline, marker, polygon, rectangle, circle)
    // E.g. add it to the map
    layer.addTo(map);
});

// Click handler for you button to start drawing polygons
$('#draw_poly').click(function() {
    polygonDrawer.enable();
});
```

Check out the docs for more info:

"draw:created" event: https://github.com/Leaflet/Leaflet.draw#drawcreated Draw handler options: https://github.com/Leaflet/Leaflet.draw#draw-handler-options

How to click a button and start a new polygon without using the Leaflet.draw UI

Solution

Problem