Questions tagged [leaflet]

An Open-Source JavaScript Library for Mobile-Friendly Interactive Maps

Filter by
Sorted by
Tagged with
2
votes
1answer
32 views

Changing layer order of vector tile layer

I am creating a simple web map using vector tiles of type pbf. The vector tiles are created with tippecanoe like: tippecanoe -pC -P -z 19 -Z 15 -e builds --drop-densest-as-needed --extend-zooms-if-...
2
votes
1answer
53 views

Remove Leaflet layer at zoom level

I can't remove a Leaflet layer from my map. I have referenced a lot of other SO threads about this very subject. Even so, removeLayer() refuses to work. addLayer() works just fine. Threads I've ...
0
votes
0answers
35 views

GeoJSON to SVG and utilize SVG in the same position as GeoJSON (coordinates)? [closed]

Maybe my question is complicated, but I wonder if I can use an SVG that was previously GeoJSON, in the same position in which the coordinates of the GeoJSON were offset? If so, how could I do it? I ...
1
vote
0answers
39 views

Local GeoJSON in Leaflet using leaflet-ajax

My aim is to include a local geojson file in my Leaflet map application using leaflet-ajax , as suggested by this earlier answer. In my root directory, I have: index.html entire contents of Leaflet ...
1
vote
1answer
28 views

Creating a hyperlink within a popup using Leaflet.JS

I have been struggling to use Leaflet (just getting back into coding) and I have done everything I would like to do but add a hyperlink to a pop-up on my map. The current code is: var marker = L....
-1
votes
0answers
14 views

How to calculate itinerary by foot and car and bicycle using OSRM and leaflet [duplicate]

How calculate distance and time between two addresses (itinerary/ routine machine) using osrm open source routine machine or any others open source tools. Calculating by foot, car and bicycle. I need ...
-1
votes
0answers
42 views

How to calculate itinerary using OSRM and Leaflet [closed]

How calculate distance and time between two addresses (itinerary/ routine machine) using osrm open source routine machine or any others open source tools. Calculating by foot, car and bicycle. I need ...
0
votes
1answer
37 views

Deferred functions, Leaflet with GeoJSON

I'm trying to chain functions, and I make a mistake somewhere, but I can't find where... First, I create a new GeoJSON layer. It works. var dataLayer = L.geoJSON(null).addTo(myMap); Next I add some ...
0
votes
1answer
33 views

I want to hide WMS layer in Leaflet

I want to hide WMS layer in Leaflet. But in a condition, display again. I tried removelayer. But once It is removed, it can not add again. here is the relevant code (generated with folium): if (zoom &...
0
votes
0answers
27 views

Changing Style of WMS dynamically with a select box in Leaflet?

I have a Leaflet WMS Layer mylayer = new L.tileLayer.wms('https://{s}.url.com/wms?', { mylayers: 'Workspace:mylayer', format: 'image/png', transparent: true, styles: 'sld1', }); ...
0
votes
0answers
26 views

Export spatial data from Web Map

I am trying to get the polygon data from the following leaflet web map http://www.cityfibre.com/rollout/. I am not really sure what kind of format I should be looking for (geojson, xml, etc..) but I ...
1
vote
1answer
68 views

Marker position in Leaflet

I use 2 markers : Icon and Tooltip. The problem is that given the sames Lon & Lat they are not at the same position. The Icon position is right, the tooltip position not. This is my js code for ...
0
votes
1answer
58 views

Adding GeoJSON coordinates as popup in Leaflet

I'm trying to add the coordinates from my GeoJSON data as popups when a user clicks on the resulting polyline that I'm plotting onto a map. I'm pretty new to Leaflet and JavaScript and am struggling ...
0
votes
0answers
28 views

Uncaught TypeError: L.control.measure is not a function

I am trying to add a Leaflet control measure my map, but I get an error in the console of browser. The error is in console is: Uncaught TypeError: L.control.measure is not a function I copied the ...
0
votes
0answers
44 views

Creating multiple Choropleth map using Leaflet

I have created a choropleth map including a legend and a div element using a JavaScript object created from GeoJSON layer using the leaflet tutorial. But when I tried to create multiple choropleth ...
0
votes
0answers
13 views

How to switch between SLD styles geoserver of one layer [duplicate]

i have one layer published in geoserver and i added 4 styles(sld1, sld2, sld3, sld4) to the same layer, now how could i to switch between 4 styles each style with the legend use leaflet ? this wms of ...
0
votes
0answers
42 views

When using react-leaflet, for Marker it shows <img src=[object Module]>

When using react-leaflet with create-react-app, for Marker it shows <img src=[object Module]> in console after changing the default icon as given in here - https://github.com/PaulLeCam/react-...
1
vote
1answer
24 views

Force L.control.layers to stay permanently collapsed

I am building a map with Leaflet 1.3.1 containing two layers controls (Control1 and Control2). For some reasons, I want one of them (Control2) to be displayed on the map, and I need it to stay ...
3
votes
0answers
47 views

Layer ordering of ST_ASMVT tiles in Leaflet

I am generating MVT tiles for multiple layers in Django using the following query: WITH bounds AS ( SELECT ST_Segmentize(ST_MakeEnvelope(8247861.100083642, 3551570.082242422, 8252753....
1
vote
0answers
28 views

Adding a Pegman of street view with a Leaflet map

I want to add a Pegman of street view to my Leaflet map. How do I add it for free and open source way to have the possibility to see street view of every place in the map?
0
votes
0answers
42 views

How to show 3D building with Leaflet

How can I use Leaflet and OpenStreetMap to display 3D buildings for free? I find same scripts but needs API key or access token. Who already has a script to show 3D map Leaflet using open source? i ...
1
vote
1answer
18 views

Dynamically changing fillColor variables in leaflet

When I want to style a polygon using a property the traditional way is to assign a function that returns a style object. Within that object you assign the fillColor property to a getColor function ...
0
votes
1answer
43 views

bringToFront() method equivalent in OpenLayers

Does OpenLayers have a method similar to bringToFront in Leaflet? In Leaflet this works as follows. If I have a layer called geometry this method will bring that layer to the top of the other layers ...
-1
votes
0answers
24 views

Can you style Mapbox raster tilesets using Mapbox Studio?

I am trying to use Mapbox to host global 300m raster tilesets that I will then visualize using Leaflet in a web viewer. Styling vector tiles or vector layers in Mapbox Studio is very straightforward. ...
0
votes
0answers
21 views

Leaflet VectorGrid interactivity doesn't work if Leaflet.markercluster is used

This is a cross-post from SO. I am trying to use Leaflet VectorGrid interactivity option for click and mouse events: const vectorGrid = L.vectorGrid.slicer(geoJsonDocument, { rendererFactory: L....
0
votes
1answer
32 views

Leaflet.VectorGrid throws error Input data is not a valid GeoJSON object

This is a cross-post from SO. I am trying to use Leaflet.VectorGrid.Slicer, but I am getting error: Input data is not a valid GeoJSON object codesandbox VectorGrid.js import { useEffect } from "...
0
votes
0answers
26 views

Why does Leaflet overlay display depend on baselayer selection? [duplicate]

I have a Leaflet map with a button that turns overlays, and overlay opacity control, on and off. Overlays are loaded transparently, can have their opacity adjusted and then can be collectively be ...
1
vote
1answer
38 views

Why does bindPopup not work inside my transparent Leaflet polygons?

I am trying to display a popup from the attribute value of a geojson layer by calling the geojson file. However, the popup displayed on the edges of the boundaries of the polygons features only. Here ...
0
votes
2answers
28 views

Leaflet Icon not pointing directly on mouse position [duplicate]

I have a project where I need to add a custom marker when the user clicks on the map. I have created my own SVG in order to show this custom marker. The problem I am facing is that the marker doesn't ...
3
votes
1answer
52 views

How to load external SLD in Leaflet?

I am trying to style my WMS map using sld_body parameter as explained in GeoServer working with SLD docs. I tested with simple SLD file as below, var sld = `<?xml version="1.0" encoding=&...
0
votes
0answers
41 views

Projecting Lat Lng onto image coordinate system (reverse georeferencing?)

We have multiple illustrated maps. They are based on real places but some features are slightly distorted or exaggerated. They are also often slightly rotated. We've already created several prototypes ...
0
votes
0answers
26 views

Leaflet marker shakes on move

Here is the case: Im creating a new marker on map: centeredMarker = L.marker(map.layerPointToLatLng([mapCenterXPx, mapCenterYPx]), markerOptions).addTo(map); And then it should center and stay fixed ...
1
vote
1answer
29 views

Location Based KNN script on Leaflet works for Chrome but other browsers and mobiles cause parse error - invalid geometry

As many of you know I have been producing a Leaflet map with a KNN function to show the closest pubs to a user's location. Live example to test for yourself: https://ces-web2.southwales.ac.uk/students/...
0
votes
0answers
45 views

How to specify a marker Icon URL?

I'm trying to change the Leaflet default Icon; in my script I set L.Icon.Default.prototype.options.iconUrl = 'Point.png'; The .png file is in the same folder than my script file but I get a broken ...
1
vote
1answer
33 views

Passing location data to a global variable in JavaScript [closed]

I am trying to pass the lat and lon of a user location to a global variable within JavaScript. The variable is instantiated at the top of the script and given value within the location function. //lat ...
0
votes
0answers
23 views

Uncaught syntax error whilst trying to get data from a PostGIS server

I am currently getting the below syntax error whilst trying to send data to a PostGIS server and retrieve the data back to a Leaflet map: Uncaught SyntaxError: Unexpected token < in JSON at ...
-1
votes
1answer
86 views

Change waypoint icon in Leaflet

I'm trying to modify the size of marker icon used to show gpx waypoints. I know I should modify iconSize: [x,z] and iconAnchor: [y,z] but I don't find where (in which Leaflet file) it has to be ...
0
votes
0answers
60 views

React leaflet map print

I want to print a leaflet map in PDF/Image formats and It will be contained, WMS layers Polygon, Markers, Polylines etc I'm using a leaflet map with React Typescript. Related versions are, react-...
0
votes
0answers
43 views

Live waypoints update on Leaflet map

I have an application that uses my Leaflet map. I want to use it like navigation. But the path is not updated. Where is the problem? setInterval(livetrack, 5000); function livetrack() { $.get("/...
0
votes
0answers
71 views

Modify GeoJSON tooltip format when using Folium to produce a map

I am producing a map using Folium. I wish to show some data using tooltips when hovering over a country. I can do this using the folium.features.GeoJsonTooltip() function and have the following result ...
0
votes
0answers
22 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 ...
0
votes
0answers
32 views

Selecting parts of a polyline on a map leaflet

Is it possible somehow to select parts of a polyline on a leaflet map? Say, I have a star-formed polyline, and I'd like to select one peak of it (and then remove it from the polyline).
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
40 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 ...
2
votes
0answers
81 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 ...
0
votes
0answers
13 views

Leaflet Plugin 'leaflet-icon-layers' doesn't show layer icons in correct size

I'm using the leaflet-icon-layers plugin to switch between a basic map and a satellite map, but their icon size isn't correct, although the set images are 80x80px. on my map they looks like this. Also,...
1
vote
0answers
69 views

GeoServer and Leaflet GetFeature problem with bounding boxes on click location

I have a Leaflet map with WMS layers from GeoServer. I want to click on a determinate location and make a GetFeature request to GeoServer so that I can show a GeoJSON on Leaflet of the features ...
1
vote
1answer
41 views

Add marker to coordinates Leaflet

i work with RStudio and Leaflet. I like to add inputboxes to type coordinates into them. Then the code should set a marker on this point and zoom on it. How can i do this? I tried to manipulate the ...
0
votes
0answers
19 views

esriPFS(Picture Filled Symbol) imageData is not displayed on Leaflet Map

import * as L from "leaflet"; import * as esri from "esri-leaflet" import "esri-leaflet-renderers"; let _layer = esri.featureLayer({ url: 'https://services.arcgis.com/...
0
votes
0answers
33 views

Getting latLngBounds for tile based on its tile coordinate using Leaflet

I would like to download raster image data in a leaflet / esri-leaflet context. To provide a little backround info: When you add an esri-leaflet raster layer to a leaflet map, you can see that on map ...

1
2 3 4 5
71