There are a number of examples online already about how to setup the basic interface for Leaflet.draw, so instead, let’s take a look at how we can grab geometries from a CARTO table for use with the library.
In the above example, we request geometries from CARTO using the format=GeoJSON parameter to get the right format in our response. Once you have the GeoJSON geometries on the map, you use drawnItems group in our Leaflet.draw control to allow editing.
Simple as that!
Now, what do you do if you want to store those edits quickly back into your CARTO account? Often times our users set up some type of proxy server to handle the exchange. First, posting the results of the edit to a proxy, wrapping those results in proper SQL on the proxy layer, and then shipping off to CARTO for storage. If you are creating editable maps for a trusted audience or if you are looking for a truly democratic set of edits, there is another way.
The security definer gives you the ability create functions on CARTO that are available in your public API but then within those functions, perform operations only possible from an authenticated user. The way they work is by accepting a small number of defined and typed parameters in the function call, and then using those parameters to do work (updates, inserts, deletes, etc). You can use them to update existing data without authentication or you can even create functions that would allow you to retrieve data from a private table in restricted ways. We have used them to create limits like custom zoom constraints on a table! This is powerful, but obviously be careful.
So, let’s create a function with a security definer that will accept our polygon edits and write them to a table,
In the above, our function accepts two parameters, a cartodb_id and the_geom. The cartodb_id tells us if we are updating an existing polygon and the_geom is our newly edited or created geometry. Next, it gives itself higher privileges on our table, and creates an upsert statement (updating the_geom if it already existed or inserting it if it is new). That’s it! Now, we can share our interface among friends and collect all our edits and additions quickly and easily.
Combine with Leaflet.draw methods