Questions tagged [leaflet]

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

Filter by
Sorted by
Tagged with
7
votes
1answer
5k views

Styling GeoServer pbf vector tiles in Leaflet

I'm serving up vector tiles in pbf format in GeoServer 2.11.2 (using the MVT extension) and consuming them in Leaflet 1.2.0 with Leaflet.VectorGrid 1.2.0 but am having trouble styling them. The URL ...
7
votes
3answers
10k views

Removing tooltip label border completely in Leaflet.js map?

I am trying to completely remove a label boundary/border (bubble) that by default appears when using my labels of a point GeoJSON layer. The layer I have is defined as below: var points_layer = new ...
6
votes
3answers
12k views

What's the most appropriate way to load Mapbox Studio tiles in Leaflet?

I'm updating a Leaflet map's basemap, and I'd like to use Mapbox to create this basemap. At first I thought I would have to ditch Leaflet and switch entirely to Mapbox GL. After digging around in the ...
6
votes
1answer
2k views

Invalid GeoJSON when inserting data to a CartoDB (PostGIS) table from Leaflet

I've been following along to this tutorial from CartoDB. I create the GeoJSON using: var drawing = "'"+JSON.stringify(layer.toGeoJSON())+"'"; and then inserting using a custom SQL function which ...
6
votes
2answers
7k views

Make WMS layer background transparent in Leaflet

I have inserted the following layer from a GeoServer WMS in the following Leaflet map : var nexrad = new L.TileLayer.WMS("URL", { layers: 'Wrecks:WrecksGreaterNorthSea', format: 'image/png', ...
6
votes
4answers
8k views

gdal2tiles.py generates wrong tiles / MapTiler the right ones

I'm trying to generate tiles with gdal2tiles.py and the resulting tiles are stored as 18/132639/164219. If I do the same thing with MapTiler (the GUI variant of gdal2tiles) the tile result is 18/...
6
votes
1answer
34k views

Changing style of marker in Leaflet(from GeoJSON)

I'm serving GeoJSON to Leaflet and by default it get a blue icon marker. I'm trying to change the style so I'll be able to use the feature properties as part of the style , but no matter what I do , ...
6
votes
2answers
10k views

Open popups in a fixed position with Leaflet

I have create my map with Leaflet exactly how I want it (with my markers and externals links). I would like to have the popup always fixes in the top right hand corner (for an example). Is there ...
5
votes
1answer
11k 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 ...
5
votes
1answer
8k views

How to get correct format of coordinates for export to geojson from QGIS?

I've created a custom map in QGIS with a few shapefiles. I'm using leaflet.js to render the map and the shapefile points and everything lines up correctly. The CRS is set to 4326. When I export the ...
5
votes
1answer
17k views

Zoom to polygon bounds on click. Leaflet ´, GeoJSON

I have a leaflet map with a lot of polygons (borders). I would like to zoom to the bounds on the polygon, when the user click. Until now its only possible for me to zoom to the the bounds of all the ...
5
votes
2answers
2k views

binding nested arrays as geojson popups in leaflet

I am struggling with geojson popups in leaflet.js I have nested arrays as properties for my features - an example would be counts of fish caught at a location (not my actual project data!) {"type":"...
4
votes
3answers
3k views

Display GeoJSON data on map using django-leaflet?

I want to display GeoJSON data on map in geodjango. When I use the below code only GeoJSON data like: { "type": "FeatureCollection", "features": [{ "type": "Feature", "properties"...
4
votes
1answer
5k views

Visualizing large datasets of polygons with Leaflet

I am using leaflet to visualize several layers in the project. One layer(load from geojson format) contains thousands of small polygons, which has a very slow loading speed. I read this Visualizing ...
4
votes
1answer
2k views

GeoJSON not showing in leaflet map?

I'm trying to load a GeoJSON file in to my Leaflet map and can't see what's going wrong. From looking at other questions I've used jQuery Ajax to call the geojson. The GeoJSON is in the same directory ...
3
votes
2answers
9k views

How do you load a GeoJSON file in Leaflet?

I'm stumped as to how to add a GeoJSON layer to an OSM map. Through Google, I've found a bunch of different answers, none of which seem to work. Following the Leaflet documentation, the simplest way ...
3
votes
1answer
2k views

z-index of geoJSONs and imageOverlays in Leaflet

There have been several Github issues raised regarding Leaflet z-indexing of layers, and I'm still not clear where things stand. I think my question is quite simple: Is it possible to set any ...
2
votes
1answer
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 ...
2
votes
0answers
4k views

Leaflet js dealing with a lot of markers in a single co-ordinate

I am using leafletjs and leafletjs market clustering. I have a list of friends and I want to display them all on a map. The problem is that some of them life in a same house, so the co-ordinate for ...
2
votes
1answer
3k views

Leaflet GeoJSON style function feature only colors one GeoJSON feature

I need to style every feature differently that I pull from a GeoJSON file. However this anonymous style function only changes the style on the first feature it comes across and stops. I am new to ...
2
votes
2answers
1k views

How does Leaflet layer ordering work with CartoDB layers?

All, I'm trying to figure out how Leaflet layer ordering works when you have layers coming from CartoDB. I have a map with 1 polygon layer (cartodb), 3 point layers (cartodb), 1 basemap layer (mapbox)...
0
votes
2answers
184 views

Map editor R & leaflet?

That is possible on a web map designed by R & leaflet give the opportunity to the user to draw lines, polygons, choose the colors (like a map editor)? if yes what's the package that allows me to ...
17
votes
3answers
12k views

Leaflet: how to draw curved lines?

So, I'm trying to draw curved lines in my application which is based on a Leaflet map. As far as I know Leaflet does not support drawing curved lines at the moment, so my question is really more ...
17
votes
4answers
42k views

How to update a popup content from its marker?

I created a popup with Leaflet doing so: marker.bindPopup(content).openPopup(); How can I update the content value afterwards? I suppose to do it from the marker, something like this: marker....
12
votes
5answers
6k views

Calculating correct longitude when it's over |180|?

I'm trying to develop a "formula" to correct the lat-lng values. I'm using vue-leaflet but when you pan outside the "first" world you get big numbers. Over +180 or under -180. For example: when I ...
10
votes
3answers
23k views

How to label GeoJSON polygons?

I'm using Leaflet combined with GeoJSON features. Is there a way to label GeoJSON features (in this case - polygons)? It should get labels from feature.properties.name This is my code where I ...
9
votes
1answer
18k views

Displaying link in popup with Leaflet?

I'm working with the Leaflet JavaScript library. There should be an option to click on my map and view a popup. I already have a code for that: var popup = L.popup(); function onMapClick(e) { popup ...
7
votes
1answer
8k views

Display L.marker without icon

Would like to start my leaflet map without any features displayed on start. The feature should not be displayed before a location is found via my search.control. I started with // first "invisible" ...
6
votes
1answer
3k views

Joining CSV to GeoJSON in Leaflet?

My goal: Store the attributes of a geojson in a csv file Allow a non-GIS user to edit a cloud-hosted csv file which then updates a webmap Have the web map be a static app with no GIS/PostGIS/SQL etc ...
5
votes
1answer
1k views

Add multiple WFS layers to Leaflet map from GeoServer using JQuery Ajax calls

I am attempting to add multiple WFS layers from GeoServer into a Leaflet map using JQuery ajax calls. It works if I set async: false, but this is deprecated and should not be used. If I remove async:...
4
votes
1answer
6k views

Load multiple GPX files to Leaflet map

Considering I have a folder that contains multiple .gpx tracks, my objective is to show each of them in a single leaflet map. Then I would personalize thing like tooltips of each track, the color for ...
4
votes
2answers
2k views

How to hide leaflet base map?

I'm building a webGIS using leaflet library. Since the data visualization is for only a certain region, it seems that the broader leaflet base map looks a bit distracting. I wonder if there's a way to ...
4
votes
1answer
2k views

Leaflet js style geojson layer according to zoom level

Leaflet js beginner following/adapting the choropleth example. I need to get something like this mapbox map where the feature styles change according to zoom level. I am loading a line geojson that ...
4
votes
1answer
7k views

Leaflet - how do you get individual markers from a featurelayer?

In Leaflet, if I have a feature layer filled with markers, how do I get these markers back from the layer? I want to apply different popups to each individual marker, instead of the entire set. I can'...
4
votes
3answers
11k views

How can I convert an image into map tiles for leafletJS [closed]

I'm trying to make it so that people can upload an image onto my site and have it converted into tiles for leaflet that can be used for a custom interactive map. The images are maps from games, not ...
4
votes
3answers
6k views

Prevent Leaflet from requesting non-existing custom tiles

I have created custom tiles using TileMill. extracted tiles as png images and adding them on base layer. using following code var venu_map = new L.tileLayer('static/b18/{z}/{x}/{y}.png', { ...
4
votes
2answers
3k views

Leaflet geoJson in front of markers in a FeatureGroup

I am loading some markers and json data to a leaflet map. I need to get my json in front of the markers. I have tried placing the markers and json in seperate FeatureGroups and then tried ...
4
votes
1answer
7k views

Setting max zoom in mapbox map?

mapObject = L.mapbox.map('mapDiv') .setView(defaultLocation,defaultZoom) .addControl(L.mapbox.geocoderControl('mapbox.places')); L.mapbox.styleLayer('mapbox://styles/...
4
votes
1answer
2k views

Displaying overlapping polyline segments as multiple lines with offsets

Selecting which polyline is displayed on top in case of segment overlaps seems to be quite a FAQ, however, I would like to find a way to display overlapping polyline segments side-by-side, i.e. as ...
3
votes
1answer
4k views

Applying a single leaflet search control to search multiple layers?

I am attempting to add a single search button to look through geoJSON layers. They will look through the field "name". Unfortunately, my method of creating a layer group is not working. What am I ...
3
votes
1answer
6k views

Leaflet: How to create toggleable overlays from a single GeoJSON FeatureCollection?

I am a beginner to Leaflet/Mapbox and I can create a simple map and plot all the points from a GeoJSON FeatureCollection, but I am unsure how to add the ability to toggle (via checkboxes) specific ...
3
votes
1answer
225 views

Accessing slope and aspect data using Leaflet?

I am building an application in leaflet, and I need to be able to access slope and aspect as a function of latitude and longitude. Currently I am able to get elevation data from the mapbox elevation ...
3
votes
1answer
6k views

GeoJSON, circlemarkers using Leaflet OverlappingMarkerSpiderfier plugin?

I am wondering if I can use the Leaflet OverlappingMarkerSpiderfier plugin with my circlemarkers. I've loaded a GeoJSON file and added circlemarkers using; var gj = L.geoJson(route, { pointToLayer:...
3
votes
2answers
485 views

Using LAT/LON in Leaflet with Geoserver GeoJSON?

We're building a simple application that takes the result of a geococde and determines which school boundary the point resides. I'm trying to figure out if I should be doing this using a ...
3
votes
2answers
6k views

Why does the className option of a Leaflet popup change only the outside of the popup?

I'm styling a popup using the className option in leaflet. Here's the entire code: <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, ...
3
votes
1answer
4k views

Changing Style of WMS dynamically in Leaflet?

I have a Leaflet WMS Layer layer = new L.tileLayer.wms('https://{s}.url.com/wms?', { layers: 'Workspace:Layer', format: 'image/png', version: '1.3.0', transparent: true, styles: '...
3
votes
1answer
1k views

Leaflet: Compare two side-by-side GeoJSON layers?

I'm trying to use the side-by-side plugin downloaded from https://github.com/digidem/leaflet-side-by-side. I want to create side-by-side GeoJSON layers to compare the cancer rates between the two ...
3
votes
2answers
774 views

Clip boundaries of heatmap according to another feature

Here is a heatmap in Leaflet (using heatmap.js and leaflet-heatmap.js) with hot spots that extend beyond the basemap boundaries: How would someone clip this? In QGIS or ArcMap you would follow a ...
2
votes
2answers
8k views

WMS GetFeatureInfo and Leaflet

I've got an application running www.carstenhogertz.de/c_section. It has a popup function showing the underlying point attribute. This function shows a strange behaviour on lower zoom levels. For ...
2
votes
1answer
2k views

Loading geojson via ajax in leaflet using bbox

I'm trying to load a geojson-layer from a postgis-database into Leaflet. I only want to fetch the data that is inside the visible bounding box of the map. The geojson-data comes from a php-script that ...

1 2 3
4
5
8