/** * Leaflet.draw assumes that you have already included the Leaflet library. */ L.drawVersion = '0.4.2'; /** * @class L.Draw * @aka Draw * * * To add the draw toolbar set the option drawControl: true in the map options. * * @example * ```js * var map = L.map('map', {drawControl: true}).setView([51.505, -0.09], 13); * * L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', { * attribution: '© OpenStreetMap contributors' * }).addTo(map); * ``` * * ### Adding the edit toolbar * To use the edit toolbar you must initialise the Leaflet.draw control and manually add it to the map. * * ```js * var map = L.map('map').setView([51.505, -0.09], 13); * * L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', { * attribution: '© OpenStreetMap contributors' * }).addTo(map); * * // FeatureGroup is to store editable layers * var drawnItems = new L.FeatureGroup(); * map.addLayer(drawnItems); * * var drawControl = new L.Control.Draw({ * edit: { * featureGroup: drawnItems * } * }); * map.addControl(drawControl); * ``` * * The key here is the featureGroup option. This tells the plugin which FeatureGroup contains the layers that * should be editable. The featureGroup can contain 0 or more features with geometry types Point, LineString, and Polygon. * Leaflet.draw does not work with multigeometry features such as MultiPoint, MultiLineString, MultiPolygon, * or GeometryCollection. If you need to add multigeometry features to the draw plugin, convert them to a * FeatureCollection of non-multigeometries (Points, LineStrings, or Polygons). */ L.Draw = {}; /** * @class L.drawLocal * @aka L.drawLocal * * The core toolbar class of the API — it is used to create the toolbar ui * * @example * ```js * var modifiedDraw = L.drawLocal.extend({ * draw: { * toolbar: { * buttons: { * polygon: 'Draw an awesome polygon' * } * } * } * }); * ``` * * The default state for the control is the draw toolbar just below the zoom control. * This will allow map users to draw vectors and markers. * **Please note the edit toolbar is not enabled by default.** */ L.drawLocal = { // format: { // numeric: { // delimiters: { // thousands: ',', // decimal: '.' // } // } // }, draw: { toolbar: { // #TODO: this should be reorganized where actions are nested in actions // ex: actions.undo or actions.cancel actions: { title: 'Cancel drawing', text: 'Cancel' }, finish: { title: 'Finish drawing', text: 'Finish' }, undo: { title: 'Delete last point drawn', text: 'Delete last point' }, buttons: { polyline: 'Draw a polyline', polygon: 'Draw a polygon', rectangle: 'Draw a rectangle', circle: 'Draw a circle', marker: 'Draw a marker', circlemarker: 'Draw a circlemarker' } }, handlers: { circle: { tooltip: { start: 'Click and drag to draw circle.' }, radius: 'Radius' }, circlemarker: { tooltip: { start: 'Click map to place circle marker.' } }, marker: { tooltip: { start: 'Click map to place marker.' } }, polygon: { tooltip: { start: 'Click to start drawing shape.', cont: 'Click to continue drawing shape.', end: 'Click first point to close this shape.' } }, polyline: { error: 'Error: shape edges cannot cross!', tooltip: { start: 'Click to start drawing line.', cont: 'Click to continue drawing line.', end: 'Click last point to finish line.' } }, rectangle: { tooltip: { start: 'Click and drag to draw rectangle.' } }, simpleshape: { tooltip: { end: 'Release mouse to finish drawing.' } } } }, edit: { toolbar: { actions: { save: { title: 'Save changes', text: 'Save' }, cancel: { title: 'Cancel editing, discards all changes', text: 'Cancel' }, clearAll: { title: 'Clear all layers', text: 'Clear All' } }, buttons: { edit: 'Edit layers', editDisabled: 'No layers to edit', remove: 'Delete layers', removeDisabled: 'No layers to delete' } }, handlers: { edit: { tooltip: { text: 'Drag handles or markers to edit features.', subtext: 'Click cancel to undo changes.' } }, remove: { tooltip: { text: 'Click on a feature to remove.' } } } } };