Questions tagged [leaflet-draw]
A plugin for Leaflet that adds support for drawing and editing vectors and markers on Leaflet maps.
132
questions
0
votes
1answer
41 views
Make a featureGroup with a layerGroup that is also editable in Leaflet?
I have a Leaflet map with a featureGroup, a layerGroup and drawControl however only the featureGroup is editable using the drawControl.
I think its because the layerGroup is separate from the ...
1
vote
1answer
32 views
Leaflet draw layers disappearing after creation in Django
I implemented leaflet in my Django project, and managed to add the draw functionalities. The thing is after i draw the shape instantly disappears. What should i do to solve the problem?
map.html
{% ...
0
votes
0answers
31 views
Make polylines curvable and dragable
I'm using Leaflet to draw polylines on a map and of course its possible to drag the endpoints, but I'm curious whether it would be able to curve a polyline? In order to for example, draw around ...
0
votes
0answers
287 views
Custom toolbar of leaflet.draw in React
I'm trying to prepare custom buttons to draw single polygon in my react app with leaflet maps. I know how to start action of drawing but I'm not sure how to ensure editing, delete and saving ...
2
votes
1answer
72 views
Editing a GeoJSON layer that I just added to the map
I have created a Leaflet map and added a GeoJSON layer like this.
var map_rgb = L.map("map_rgb",{center: [userLat, userLon],crs: L.CRS.EPSG3857,zoom:'{{zoom}}',zoomControl: true,preferCanvas:...
1
vote
0answers
153 views
Sharing a single common boundary line within two polygons with Leaflet
Is it possible in Leaflet, to share a single common boundary within two polygons, other than two overlapped boundaries within a MultiPolygon layer?
In this plugin (leaflet-geoman), they have mentioned ...
0
votes
1answer
113 views
Drawing on Leaflet map give incorrect coordinate
I am using Leaflet and OpenLayers. When I draw a bounding box I am getting the correct lat and lon if I use OpenStreetMap tilelayer. When I switch to using EarthData tilelayer the bounding box is ...
0
votes
0answers
26 views
Intersection with turf.js [duplicate]
This is my full code for intersection of a drawn line with polygon feature class. I am not getting any error on console neither getting the required output. What is the problem with my code?
Here is ...
1
vote
0answers
23 views
Intersection using turf js [duplicate]
I am giving this for intersection of a polyline using Leaflet draw plugin with polygons feature class. Here is my code
function intersectPolyByPolyFC(poly,fcPoly){
var fgp=[];//variable for ...
0
votes
0answers
50 views
ReactLeaflet Returning GeoJson
I'm new to Webmapping I already create a map with ReactLeaflet and ReactLeaflet Draw, but I can't imagine how can I get the geoJSON from the polygon and just send to a database or an API
export ...
1
vote
1answer
66 views
Plotting polygon with hole as two separate polygons using Leaflet
I've a polygon with a hole which I created using turf.difference method. Now, I need to plot that GeoJSON on another screen and make both the inner polygon as well as outer polygon editable. Since I'm ...
2
votes
0answers
304 views
Polygon intersection using turf js
I have given this code for intersection:
function intersectPolyByPolyFC(poly,fcPoly){
var fgp=[];//variable for feature group
var bbPoly=turf.bboxPolygon(turf.bbox(poly));//polygon ...
1
vote
0answers
235 views
Spatial operations with JSTS
I'm working with Leaflet and I'm also working with JSTS to do the spatial operations. In most of the cases I want to create Polygons inside another Polygon Geometry.
In this case the yellow shape is ...
0
votes
0answers
59 views
Is it necessary to sanitize GeoJSON/WKT inputs to Leaflet / Terraformer?
I am currently building a website which includes the following:
a Leaflet map where users can draw polygons using Leaflet-draw (and enter other data using HTML forms)
a paired text field where users ...
1
vote
0answers
60 views
How to add and delete the Leaflet OpenStreetMap dynamically
I have to place the Leaflet maps to be placed in the bootstrap grids (maps has to place dynamically with the number of elements coming from the backend i.e number of elements = no of Leaflet maps).
....
0
votes
0answers
101 views
Saving polygon coordinates into MySQL
I am currently building a housing complex mapping in my regency with PHP, Leaflet.draw and MySQL to store the data.
My problem is, how to save the polygon coordinates into MySQL?
I am extremely new to ...
3
votes
1answer
275 views
Options for styling Leaflet Draw line segements
I am playing around with the options for Leaflet-Draw and have came up wit a little annoyance. Using a colorpicker I can set the color for every new polyline I draw by invoking options.draw.polyline....
5
votes
2answers
1k views
Adding different types of marker on the map with using Leaflet.draw
I am using Leafletjs with Leaflet.draw to create an interactive map on my web.
But I need to enable different types of "marker". And then when creating them I need to identify them. I tried ...
1
vote
0answers
53 views
Is there any tool or somehow to make a OpenStreetMap editor which can manage multi layer in it?
I need to build a web application that could draw, edit, import, export,.. map using OSM data. In that, I could add layers and manage like tree form. The layer can be toggled on/off on the map to edit....
1
vote
1answer
598 views
Leaflet.Draw options - dynamically changing polyline color
I am playing around with the Leaflet.Draw plugin and its options. What I try to do is dynamically setting the color option for the polyline to a variable like this:
let options = {
position: '...
0
votes
0answers
157 views
Leaflet Draw Error
I'm trying to incorporate Leaflet. Draw on my map but I get the following error
I'm using version 1.7.1
Draw.Polyline.js:55 Uncaught TypeError: Cannot read property 'draw' of undefined
at ...
0
votes
0answers
854 views
Removing the Leaflet draw toolbar when added as Leaflet control
I add a draw-toolbar (I'm using the my own version from the example "Disabling a toolbar item")
drawnItems = new L.FeatureGroup();
map.addLayer(drawnItems);
var drawControl = new L.Control.Draw({
...
0
votes
1answer
38 views
How to triger a function after draw delete?
I'm using Leaflet draw and I want that after the user remove the path he created it will trigger a function.
After the user finished drawing a path I also do something:
map.on('draw:created', ...
0
votes
0answers
467 views
Leaflet PlayBack
I am trying to animate with the https://github.com/linghuam/Leaflet.TrackPlayBack plugin. I have approximately 100 coordinates and ID numbers defined in each coordinate. Can different symbols be used ...
0
votes
0answers
725 views
Leaflet draw - Edit event after editing existing feature
I was inspired by this post
How to edit an existing layer using leaflet? I can click on an item to make it editable.
But this does not "activate" the drawControl to allow me to click save or cancel, ...
0
votes
0answers
330 views
Why snapping doesn't work on Leaflet version 1.0.0 and newer?
On documentation of Leaflet.Draw, Snapping sample is not working with Leaflet 1.0 but it works with Leaflet 0.7
http://leaflet.github.io/Leaflet.draw/docs/leaflet-draw-latest.html#l-draw-polyline
Is ...
1
vote
0answers
5k views
Remove a Drawn Polyline from LeafLet Map
How can I simply just remove this polyline from the map?
var pointA = L.latLng(From.lat, From.lng);
var pointB = L.latLng(To.lat, To.lng);
var pointList ...
0
votes
1answer
447 views
Overlay with the feature collection properties
I have the GeoJSON:
[{"type":"FeatureCollection",
"features":[
{"type":"Feature","properties":{"id":27,"name":"F001"},"geometry":{"type":"LineString","coordinates":[[-100.231018,47....
1
vote
1answer
567 views
Checking if a specific leaflet.draw control is enabled?
Where exactly are the leaflet controls stored that are added to the map?
So at anytime in the app, I can check something like
if(controls.polyline.enabled==true)
My guess is its somewhere in the map....
0
votes
1answer
3k views
Custom functions for SAVE and CANCEL on Leaflet.draw edit control
I have added an edit control on my map which is working fine (On the Frontend);
var editControls = new L.Control.Draw({
draw: false,
edit: {
featureGroup: this.updateGeomLyr
...
2
votes
1answer
2k views
Cutting holes in custom polygon made with Leaflet.Draw
I would like to be able to create holes in polygons made with Leaflet.Draw plugin. For example, I currently have code like this: https://jsfiddle.net/4gkrfu5b/
If you draw a polygon on top of another ...
0
votes
1answer
206 views
Leaflet.Draw save coordinates
I'd like to save the polyline coordinates. I'm creating it with Leaflet.Draw. The problem is that the coordinates are stored twice.
49.907018,16.324997,49.907018,16.324997,49.818936,16.340103,49....
0
votes
0answers
423 views
Create a custom draw Toolbar
I would like to create my own custom toolbar for leaflet.draw plugin but I don't know how to approach this solution.
To be more clear, I am trying to create a side-panel with buttons for each action, ...
3
votes
1answer
1k views
Prevent user from drawing a feature with Leaflet.draw
In my application using Leaflet.draw the user can set point markers on a map.
I would like to allow the setting only in a certain area.
The function isMarkerInsidePolygon(marker, polygon) returns ...
0
votes
0answers
408 views
Leaflet draw: prevent drawing through a custom overlay
I have a leaflet draw implementation (in Angular) with a custom sidebar that overlaps the Map. It should not be possible to draw through that sidebar.
For circlemarkers I could solve this problem ...
0
votes
0answers
667 views
Pushing features to external GeoJSON file
I am working on a project which uses Leaflet and leaflet.draw to show and draw shapes on the map. I also have a data.json file which I use to display former features generated from geojson.io. What I ...
0
votes
1answer
1k views
Allowing users to add data to marker that they create on Leaflet map?
I have created a basic web map and implemented leaflet.draw functionality to it. What I would like to do is allow anyone that visits the web map to use the draw tools to add a marker (point) and when ...
-1
votes
1answer
362 views
Finding precision of polygon in Leaflet? [duplicate]
In order to convert coordinates to geohash I need to know the precision as well but unable to figure how to do so..
Any suggestions?
** EDIT **
What I try to do is to find the precision in leaflet ...
0
votes
1answer
270 views
How to repeat drawing function in Leaflet
I am trying to create a Leaflet.js web map that gives users the opportunity to draw lines.
this line will be sent to mapquest elevation API to be retun to the map as a GeoJSON with elevation data ...
0
votes
0answers
696 views
Editing attributes of a GeoJSON in Leaflet
I have a map in which I'm trying to create the capabilities of adding new features and editing attributes of new and existing features. I have managed to make the feature editable but I want people to ...
2
votes
0answers
180 views
Use leaflet-draw-toolbar with angular 2
Is it possible to use leaflet-draw-toolbar with angular 2 and ngx-leaflet-draw?
I do not see, and I am not versed in Angular 2, enough, to incorporate the JS library for leaflet-draw-toolbar into my ...
1
vote
1answer
1k views
Leaflet: get layer in GeoJSON with pixel coordinates instead of lat long coordinates
In my Angular 7 project with ngx-leaflet and leaflet 1.4.0 and leaflet-draw 0.4.14 I want to export each drawn rectangle (and circle,...) to GeoJSON.
That works fine using
public onDrawCreated(e: ...
3
votes
0answers
184 views
Function fires despite conditional query in leaflet-map
In a map built with Leaflet I created a button to export and download data as geoJSON drawn before by the user with Leaflet.draw.
To prevent an empty download, I am querying the existence of data.
...
3
votes
1answer
1k views
ipyleaflet draws?
If I draw a circle with map control in a map, how can I store in a variable?
from ipyleaflet import Map, basemaps, basemap_to_tiles, DrawControl
watercolor = basemap_to_tiles(basemaps.Stamen....
2
votes
1answer
2k views
Creating popup forms with Leaflet (L.Draw). How to implement listeners for radio buttons and other input groups?
I am attempting to create a map-based survey using Leaflet popups and specifically L.Draw, because I want users to be able to insert markers where ever they want to and then answer certain questions.
...
3
votes
0answers
997 views
How to change the layer selection view from Radio button to Image in Leaflet
I have implemented the below example to show the multiple base layers of map in my application using LeafletJs.
Leaflet JS LayerGroup example
I'm able to successfully implement the same but I'm ...
1
vote
1answer
5k views
How to highlight marker dynamically with leaflet and leaflet draw
I am trying to make a selection via drawing a rectangle (or any shape) with leaflet draw. The selected features should be highlighted. I saw that there are various functions within the leaflet source ...
2
votes
1answer
2k views
Revert a Leaflet.draw edit event
I'm trying to prevent a user in edit mode from creating overlapping shapes. With a CREATED event, I can easily remove the layer. But I want to revert an edited shape back to its original position ...
0
votes
2answers
899 views
Updating popup of a Leaflet Polygon
I am trying to update a popup for a polygon that I have drawn with Leaflet.Draw. Now I understand that to set a popup to a layer I just created, it's all fine. I can also get the id of that layer I ...
3
votes
2answers
2k views
Leaflet popup disappear or moved over drawn polygon
If I would like to popup something over an actually drawn polygon,
then it sometimes disappear or moved to the first point of the polygon.
https://jsfiddle.net/o149mgwj/19/
var drawnItems = new L....
