Questions tagged [leaflet-draw]
A plugin for Leaflet that adds support for drawing and editing vectors and markers on Leaflet maps.
1
vote
0answers
18 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 ...
0
votes
1answer
50 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
0answers
24 views
Revert the resized polygon in L.Draw.Event.EDITED event
I'm trying to stop the user in edit mode to don't overlap on other shape. In CREATED event, I can easily remove the layer. But in EDITED event I want to revert the shape back to original position ...
0
votes
0answers
52 views
Extract PostGIS data using shapefile/GeoJSON in OpenLayers/Leaflet
I have a PostGIS database of large shapefiles and would want A Web-App be able to let the user upload the .shp file and extract data based on it's extent.
I've used the OpenLayers library to ...
0
votes
2answers
26 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 ...
1
vote
2answers
123 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....
1
vote
0answers
119 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 ...
0
votes
1answer
369 views
Entering manual coordinates to draw polygon in Leaflet?
I want the user to enter manual coordinates of a polygon and then to click on a button to draw the polygon.
My code:
<body>
<div>
Polygon: <input type="text" name="...
1
vote
0answers
466 views
Show marker only in area polygon [closed]
I got task, to plot polygon on map. After finish draw only marker inside a polygon appear on map. I'm done with leaflet.draw and Draw.Event.Created. What method I can use to check which marker inside ...
0
votes
0answers
50 views
The map pane puts the polygons below the layers
I'm using Leaflet 1.3.1. Adding services via ArcGIS REST API:
map.createPane(service);
let new_service = L.esri.dynamicMapLayer({
pane:service,
url: url,
opacity : 1,
...
0
votes
2answers
1k views
How to get the exact Circle that user has drawn using Leaflet.draw.Circle?
I have a simple Leaflet map, where The user can draw a Circle, using Leaflet.Draw.
When you use the following code to get the geometry,
map.on(L.Draw.Event.CREATED, function (event) {
var ...
3
votes
0answers
831 views
Get the lat/lng values of lines, polygons drawn by Leaflet drawing tools
I am new to JavaScript and Leaflet too. I made a basic map in Leaflet. I have also floated one sample geojson file in it. Now I also want leaflet for sourcing(co-ordinates) to my PHP file. So I need ...
0
votes
1answer
31 views
Leaflet draw - adding actions to prefilled markers
There are a bunch of markers which need to be loaded by default. The user can edit these markers and their corresponding properties in the popup window. The user can also add new markers and fill in ...
2
votes
1answer
163 views
How to use Draw.js in a Leaflet offline map
I'm trying to build a data-collecting map using Leaflet. To do this I have to download the Leaflet JavaScript files but I can't find out how to download a working draw.js.
When I download draw.js I ...
2
votes
1answer
414 views
Leaflet.Draw - GeoJSON to KML
I have made a map using the Leaflet Draw plugin which allows the user to download their drawn items. These drawnItems are exported as GeoJSON using the following code from here:
document....
0
votes
0answers
151 views
Change style of leaflet draw
I want to change the style of edges that I think are ugly in leaflet draw ( I'm speaking about the big rectangles ), I did some research on internet and found that I need to do something like:
...
0
votes
0answers
170 views
Submit a form from within a leaflet popup save in data base?
I have a leaflet map in angular 4 and I want to add park out a form in a leaflet popup and upon clicking the 'submit' button - the information in the form will be inserted into my MySQL database.I try ...
0
votes
0answers
306 views
leaflet toolbar in typescript?
I'm new in using the leaflet map with angular 4.
How do I add a leaflet toolbar with type script?
I find only a toolbar with javascript this is my map.component.ts
import { MapService } from './../...
1
vote
0answers
204 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 ...
0
votes
0answers
525 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 ...
2
votes
1answer
1k views
React-Leaflet-Draw: accessing a polygon's array of coordinates on save
I've got a component which puts an editable polygon on the map. When the user hits the "save" button, I want to access an array of the polygon's new vertices, so that I can save them. How do I do ...
0
votes
0answers
119 views
how to use time dimension plugin for vector grid in leaflet?
I have used L.TimeDimension.Layer.GeoJson in my application, polygon not displaying properly(i.e not displaying polygon in Meridian)
Then I found that vector.Grid displays the polygon at meridian but ...
1
vote
1answer
1k views
How to detect “delete” or “edit” events in popup menu created with Leaflet-draw-toolbar plugin?
In this example you may create a polygon and then click it and popup menu shows. There is three buttons: edit, delete and pick a color. How can I detect event and determine which of it - delete or ...
1
vote
1answer
778 views
Correct method to save and restore leaftlet drawing into mysql database
I have the following code for saving my coordinates of what I draw. So what I do on drawing created I have the following function.
map.on(L.Draw.Event.CREATED, function (e) {
var type = e....
1
vote
0answers
285 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 ...
1
vote
0answers
53 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 ...
2
votes
0answers
238 views
how to save drawable entities with leaflet.draw/draw polygons into my Postgis database with getting also the coordinates
I am very new to creating webmaps with Leaflet and I am trying to save my shapes I draw into my postgis db. I would prefer to be saved as .shp or any default format (i.e. json) with its geometry field....
1
vote
1answer
545 views
Spatial Queries in Leaflet, select polygons from (A1,A2…An) which intersect with polygon (B)
I am looking for an online solution for leaflet where I can select and export (console log, geojson, addLayer) a group of polygon from a geojson file which intersect with a drawn polygon (with leaflet ...
0
votes
1answer
475 views
Can Draw and Edit mode be enabled at the same time on Leaflet?
Imagine you want to draw several shapes (marker, linestring, polygon) and also edit them after the shape is drawn or whenerver you want having the possibility to continue adding stuff.
at the moment ...
1
vote
0answers
198 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 ...
1
vote
2answers
1k views
Removing tool from Leaflet Draw
I am using Leaflet draw for adding Draw toolbar to my leaflet map. I am using angular leaflet directive to add the map. I want certain elements of the draw toolbar to be removed, specifically (line ...
1
vote
0answers
168 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
2answers
447 views
Get <canvas> features inside a rectangle after drawing it
Let's start with https://jsfiddle.net/ziyuang/dfekwzhd/
Say, now I want to allow users to specify areas by drawing rectangles. After the map having a rectangular area, I want to have the information, ...
1
vote
0answers
46 views
How can the users of my map add their favorite places [closed]
I want to create a map where the users of my website can add their favorite touristic places by clicking on the map and add some attributes.
I don't mind if it's done by Leaflet openlayers or any ...
-1
votes
1answer
413 views
Finding the centre of a circle drawn using leaflet draw and also calculating the distance between 2 lat longs
Am new to JS so the below queries may look simple.
Query: I have drawn multiple circles on the map and i need to fetch all the markers details available with in the circle.
In order to achieve that ...
8
votes
1answer
2k views
How to enable a Leaflet Draw tool programatically
I'm using the Leaflet Draw control, and would like to enable/activate a particular tool (Draw Polygon) using JavaScript, so that this tool is active when the page loads. Is this possible?
https://...
1
vote
0answers
459 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, ...
2
votes
1answer
235 views
Allow popups to show through another layer
I have a Leaflet feature layer (Layer1) with popups bound.
I'm using Leaflet Draw to draw a polygon in Layer2 over the feature layer.
I want to then be able to open the popups for Layer1 while still ...
1
vote
0answers
475 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....
1
vote
0answers
1k views
Reason for “L.Control.Draw is not a constructor” error?
Below is my code:
<!DOCTYPE html>
<html>
<head>
<title>Simple Leaflet Map</title>
<meta charset="utf-8" />
<link rel="stylesheet" ...
1
vote
1answer
2k views
How to set the icon for a Leaflet marker based on a variable
I'm just beginning to learn coding in d3 and leaflet, i have some code that i'm experimenting with and facing some problems with setting the icon.
I wanted to change the leaflet icon depends on the ...
1
vote
1answer
1k views
Displaying bounding box array on leaflet map
I have a set of bounding box arrays which I want to display over leaflet map in my application. The arrays look something like this with the bounding box co-ordinates in it:
Array[4]
0:
-2....
0
votes
1answer
613 views
Leaflet: edit popupcontent
Im looking foward to create a mobile leaflet application to collect data.
First i use the L.locate-control plugin to get my current location:
L.control.locate({
strings: {
title: "current ...
2
votes
1answer
1k views
leaflet.draw error adding control
I'm facing problems with this plugin. I can not even add a toolbar. This is what I'm doing:
In index.html file I'm using this lines:
<script src="https://unpkg.com/leaflet@1.0.2/dist/leaflet.js"&...
1
vote
2answers
882 views
Find leaflet id of the latest layer created in Leaflet
I am adding layers to a layergroup "drawnitems" in leaflet
drawnItems.addLayer(L.polygon(polygon));
I need to find the leaflet id of the layer created using the above code immediately upon its ...
0
votes
1answer
494 views
How put Leaflet Filelayer data into editable layer so I can edit after Upload
I am using “togeojson” and “Leaflet.FileLayer” for File upload in my leaflet draw using below Code:
L.Control.FileLayerLoad.LABEL = '<img class="icon" src="folder.svg" alt="file icon"/>';
...
2
votes
1answer
849 views
Add touch events to leaflet
I am developing an application that collects data by drawing on the map different shapes.
I am usinf LeafletJS and ionic framework, when I test the application on the computer browser it works fine, ...
2
votes
1answer
781 views
Leaflet Tooltip bug when added leaflet-draw
Here's a simple demonstration:
The file leaflet.draw-src.js was downloaded here: https://github.com/Leaflet/Leaflet.draw/tree/master/dist
If you remove the script tag with the leaflet.draw-src.js the ...
1
vote
1answer
444 views
Adding button to move map Direction in Leaflet?
I want direction button in my Leaflet map so user can move map in mobile or desktop browser easily.
I am new and do not know how to start. Please guide me.
2
votes
1answer
4k views
Leaflet.draw: add attributes and save to file
I want to create a simple web page, where user can create features (with Leaflet.Draw), add attributes (ex. name/description) and save created features to file, ex. geojson. So far creating, adding ...
