Stack Overflow
Stack Overflow

Questions tagged [leaflet]

Leaflet is an open-source JavaScript library for mobile-friendly, cross-browser, interactive maps. For the R leaflet package, please use the r-leaflet tag.

Leaflet is an open-source JavaScript library for displaying interactive maps. It can be extended with the use of plugins and has an extensive well-documented API.

Leaflet is designed with simplicity, performance and usability in mind. It works efficiently across all major desktop and mobile platforms out of the box, taking advantage of HTML5 and CSS 3 on modern browsers while still being accessible on older ones. It can be extended with many plugins, has a beautiful, easy to use and well-documented API and a simple, readable source code that is a joy to contribute to.

Browser Support

On Desktop

  • Chrome
  • Firefox
  • Safari 5+
  • Opera 12+
  • Internet Explorer 7–11

On Mobile

There are now two packages for using Leaflet from within the R language for data analysis and visualization. You can also use Leaflet from within R using the Leaflet package at Leaflet for R. Additionally, you can read the documentation on another package r-leaflet at http://cran.r-project.org/web/packages/leafletR/leafletR.pdf.

Online resources

13879 questions
39
votes
3 answers

Simple label on a leaflet (geojson) polygon

I am attempting what I imagine to be a fairly common use-case with a leaflet multipolygon object. I create the MultiPolygon using geojson: var layer = L.GeoJSON(g, style_opts); What I'd like is to put a simple text label in the center of each…
Hoopes
  • 3,943
  • 4
  • 44
  • 60
38
votes
3 answers

Dynamically change the color of a polygon in leaflet?

For anyone who is familiar with Leaflet, do you know a way to dynamically change a polygon's color? For example, take a circle defined like this: window.circle = L.circle([51.508, -0.11], 500, { color: 'red', fillColor: '#ffffff', fillOpacity:…
Owen
  • 1,652
  • 2
  • 20
  • 24
37
votes
2 answers

Good way to combine React and Leaflet

I am working on a project to combine React and Leaflet, but I must say I am having some hard time with the semantics. As most of the stuff is managed by Leaflet directly, I don't know if it would make sense to add the Leaflet map instance as state…
Swann
  • 2,413
  • 2
  • 20
  • 28
35
votes
5 answers

Finding the center of Leaflet polygon?

I have a bunch of leaflet polygons on a map I created. Each polygon represents something different. A specific set of information is displayed in a popup depending on the page the user is on. I need to find a way to make the "popup" bubble open in…
Nxlevel
  • 788
  • 1
  • 7
  • 17
34
votes
2 answers

Leaflet.draw retrieve layer type on draw:edited event

I'm using the https://github.com/Leaflet/Leaflet.draw plugin and I'm trying to retrieve the layer type of an edited layer. On the draw:created event, I have the layer and layerType, but on draw:edited (triggered when saving all edits) I get a list…
Danimt
  • 1,057
  • 2
  • 13
  • 23
33
votes
4 answers

How do you add a class to a Leaflet marker?

I'm using custom divIcons for my Leaflet markers. I want to add a border to whatever marker I click on, with some simple CSS: .selectedMarker { border: 10px solid gold; } However, the following with jQuery doesn't…
yesman
  • 7,165
  • 15
  • 52
  • 117
32
votes
12 answers

Leaflet Marker not found production env

I got a problem with leaflet. Everything is working fine in development, but in production, my app isn't able to locate the marker-icon.png and marker-shadow.png images. It is looking for the path assets/station/images/marker-icon.png Leaflet js is…
maluss
  • 602
  • 1
  • 8
  • 14
31
votes
9 answers

React-Leaflet marker files not found

I've got very simple code to display a map using react-leaflet and place a marker on it. However, i get the following two errors in my browser console GET http://localhost:8080/marker-icon-2x.png 404 (Not Found) GET…
user3059217
  • 521
  • 1
  • 6
  • 9
31
votes
3 answers

Determine if a point reside inside a leaflet polygon

Suppose I Draw a polygan using leaflet like in the follow demo: http://leaflet.github.io/Leaflet.draw/ My question is how I can determine if a given point reside inside the polygon or not.
Majdi Taleb
  • 731
  • 3
  • 9
  • 26
30
votes
5 answers

How Do I connect two coordinates with a line using Leaflet in R

I am trying to use Leaflet package in R to draw a amp and connect the markers given the latitude and longitude information in the table below. | Observation | InitialLat | InitialLong | NewLat | NewLong | …
maluwalmk
  • 337
  • 1
  • 3
  • 8
30
votes
2 answers

How to interact with leaflet marker layer from outside the map?

I have a leaflet map showing points for public art pieces, rendered from GeoJSON. Next to the map, I created a list of the pieces from the same GeoJSON data and want to be able to click on an item from the list outside of the map and have the…
roy
  • 3,706
  • 6
  • 30
  • 53
29
votes
9 answers

Leaflet with next.js?

I am getting a ReferenceError: window is not defined when using next.js with leaflet.js . Wondering if there's a simple solution to this problem - is using next.js overcomplicating my workflow? for those curious with the exact code, import React,…
LeCoda
  • 538
  • 7
  • 36
  • 79
29
votes
2 answers

Draw lines between markers in leaflet

I'm trying to insert lines between markers (which are generated from JSON data) in leaflet. I saw an example, but it doesn't work with JSON data. I can see the markers, but no lines appear. var style = { color: 'red', fillColor: "#ff7800", …
user4131013
  • 425
  • 1
  • 7
  • 14
29
votes
1 answer

Marker mouse click event in R leaflet for shiny

How can I receive a mouse click event on a marker in a leaflet map in R? I'm using the RStudio/leaflet and running through Shiny. I'd like to get the value of a marker (e.g., ID) and use that to update a sidebarPanel.
RCG
  • 291
  • 1
  • 3
  • 3
29
votes
5 answers

Leaflet center popup AND marker to the map

I want center my marker on popup open.. and centering map not in marker latlng, but on center of marker and popup! The problem is that popup has dinamic content(loaded on click). The map size is full display size in a mobile device! I'm just used…
stefcud
  • 2,220
  • 4
  • 27
  • 37
1 2 3
…
99 100