Questions tagged [leaflet-draw]
A plugin for Leaflet that adds support for drawing and editing vectors and markers on Leaflet maps.
46
questions with no upvoted or accepted answers
3
votes
0
answers
255
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.
...
- 1,079
3
votes
0
answers
1k
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 ...
- 131
3
votes
0
answers
2k
views
Leaflet Draw: edit/delete features of different layers
I use Leaflet Draw and Leaflet WFST plugins to create/edit features and save my edits to PostGIS Database (hosted by GeoServer). I have three layers: points, lines, and polygons. I manage to make new ...
- 356
2
votes
0
answers
346
views
Drawing buffer zones in React-Leaflet
I am working with a Leaflet in react.js and using react-leaflet-draw. I can't draw a buffer on shapes drawn by react-leaflet-draw. Just like a “leaflet-buffer”.
- 121
2
votes
0
answers
3k
views
Leaflet/Vue 3 Issue Uncaught TypeError: Cannot read properties of null / this._map is null
I am facing an error on Leaflet on Vue 3 whenever i try to zoom in or out when a popup is closed. The error on Mozilla:
Uncaught TypeError: this._map is null Popup.js
and the error on chrome
...
2
votes
1
answer
2k
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:...
- 21
2
votes
0
answers
899
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 ...
2
votes
0
answers
154
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....
2
votes
0
answers
12k
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 = [pointA, pointB];
var st_line ...
- 121
2
votes
0
answers
235
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 ...
- 131
2
votes
0
answers
189
views
Placing image between two marker using css in Leaflet?
In my application where i use leaflet api, i am able to put two gate markers and polyline drawn between them.
Here, i just wanted to find out the way to put the image from css on the polyline which ...
2
votes
0
answers
1k
views
Can't get the correct measurements: Leaflet
I am working with the simple app Beta Here
The application is using leaflet plugins/api....
User draw a line(poly-line) on the map/image and then enter the distance between two points....
Working
...
2
votes
0
answers
1k
views
how to bind custom marker controls to map : leaflet
I am working on map control app using leaflet plugin ....
I added a custom button for marker in side toolbar....
Target
I want to put marker on map when i click on that button....in other words i ...
2
votes
0
answers
263
views
How to define title, description and color in leaflet Draw
I am trying to create a participatory mapping site where users can draw polygons using Leaflet draw.
Just to know how can i create a pop window where users can define a title, description and color ...
- 41
2
votes
1
answer
3k
views
Adding comments using leaflet draw
I am working on an application that will leverage the leaflet draw plugin so that a user can open my map and drop comments in the form of markers. Then the user can click submit and it will serve me ...
- 71
1
vote
0
answers
527
views
How to add custombutton on Draw toolbar leaflet?
I want to add custom button on Draw toolbar where I need to add my own functionality .
I have wrote my code as :
var drawControl = new L.Control.Draw({
draw: {
marker: false,
...
- 283
1
vote
0
answers
664
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 ...
1
vote
0
answers
636
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 ...
- 51
1
vote
0
answers
515
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).
....
- 11
1
vote
0
answers
603
views
Leaflet Marker render
I now have a map and get the basic of the map from a geoJSON file.
Now i have a websocket and sent always positions from 3 different people. So how can i add a marker , which i can move to another ...
- 11
1
vote
0
answers
1k
views
While Dragging, created marker with connected polyline from toolbar,previous polyline between two marker deleted using leaflet?
When dragging created marker with connected polyline from toolbar,previous polyline between two marker automatically deleted or auto connect from with new draggable marker?
I'm try to dragging ...
- 11
1
vote
0
answers
81
views
Can't execute Leaflet Layers properly
https://jsfiddle.net/324h2d9q/87/
I tried to make a map with Leaflet where I have multiple layers where I sort things via category, but it seems that it is not working... If I click on ,,Muzee", it ...
- 121
1
vote
0
answers
427
views
Relating Polygons to Results in AngularJS & Leaflet
I am using Lealfet.draw tools for creating polygons and then fetching results from a database based on the coordinates of those polygons. I want to be able to relate each polygon to it's ...
- 335
1
vote
0
answers
477
views
Clustering polygon's created with Leaflet.Draw
I am experimenting with Leaflet at the moment and am trying to cluster polygon's that I've created with Leaflet.Draw plugin's tools. I know that clustering polygons is possible (Is it possible to ...
1
vote
0
answers
1k
views
Select multiple choice of marker - leaflet draw angular 2
I want to create a function that can select multiple choice of marker like Mapmarker National Geographic using a leaflet draw component. I already created a toolbar that the user can draw polylines, ...
- 111
1
vote
0
answers
1k
views
Download google tile layer maps
I am using google map in leaflet like this
var osmUrl = 'http://{s}.google.com/vt/lyrs=s&x={x}&y={y}&z={z}',
osmAttrib = '© <a href="http://openstreetmap....
- 271
1
vote
0
answers
105
views
coords of the previous drawned polylines are sent to PostGIS with a form when sending coords of a new drawned polyline
I have a leaflet map in which I can draw some polylines and send their data and coordinates in a PostGIS database with Ajax and Php.
When I've created a polyline and send their information in my ...
- 137
1
vote
0
answers
89
views
Same behaviour for minzoom for google maps api and leaflet
I need to implement the same behavior for leaflet and google maps for the case of minzoom. Google maps duplicates all the objects from the main map to the world`s copies, however leaflet doesn't since ...
- 163
1
vote
0
answers
868
views
How to pass custom marker to polyline decorator
I am working with leaflet appliction, where user draw some shape.
A polyline added to that shape using leaflet.polyline.decorators.
I just want to know how to pass custom marker to L.Symbol.marker().
...
1
vote
0
answers
513
views
Drawings not visible after removeLayer method : leaflet
Introduction
As i am working on application which uses leaflet api. Live Here
Where first user enter '1' as input to load the image on map.
Then user can draw different shapes(fences) using bottom-...
1
vote
0
answers
400
views
Solution to draw objects on layers and share maps
I'm looking for an online solution to build custom maps on top of OSM/Bing/Google layers and share them via export or link. I need to find an address, draw and drop lines, polygons, circles, add and ...
- 95
0
votes
1
answer
57
views
Install Leaflet plugins in Python based environment for web GIS building purpose
I am in the middle progress of building a webgis that utilize python Flask as backend and Leaflet to build the maps. I can still manage until the step where I implemented the vanilla Leaflet and just ...
- 13
0
votes
0
answers
329
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 ...
0
votes
0
answers
626
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 ...
0
votes
0
answers
319
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 ...
- 101
0
votes
0
answers
3k
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({
...
- 141
0
votes
0
answers
1k
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 ...
- 31
0
votes
1
answer
2k
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, ...
- 1,683
0
votes
0
answers
587
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 ...
- 99
0
votes
0
answers
971
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, ...
0
votes
0
answers
626
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 ...
- 13
0
votes
0
answers
933
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
0
answers
1k
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 ...
0
votes
2
answers
1k
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 ...
- 101
0
votes
0
answers
3k
views
Showing draw control in custom (own) div using Leaflet
I'm trying to put a Control into an existing div but I don't really know where or how I can force the map.addControl method to show the control (it is a draw control by the way) within an already ...
- 2,536
0
votes
1
answer
1k
views
Importing Leaflet Draw NGX for angular 4
I followed the steps from the main git:
https://github.com/Asymmetrik/ngx-leaflet
first I installed the required libraries (leaflet, leaflet-draw, leaflet-ngx, and leaflet-draw-ngx)
then I declared ...
- 313