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
28
votes
3 answers

R and Leaflet: How to arrange label text across multiple lines

Suppose you have the following data frame: cities = data.frame( name = c('Madrid','Barcelona','Sevilla'), country = c('Spain','Spain','Spain'), region = c('Comunidad de Madrid','Cataluña','Andalucia'), …
LuPi
  • 295
  • 1
  • 3
  • 6
28
votes
7 answers

How do I change the default cursor in leaflet maps?

I am trying to modify the default cursor icon when a certain control button is pressed. Although I was partially successful by using css on the container div, doing this overrides the move cursor state, which is something I do not want. What I mean…
Marco Toniut
  • 568
  • 1
  • 7
  • 16
27
votes
2 answers

leaflet.js disable duplicated world maps

We need to disable duplicated world maps at the left and right side of the main world map, which is showing by default. Problem is that we need exact zoom level there and sometimes leaflet showing duplicates... Is it possible to remove duplicates at…
nvvetal
  • 1,756
  • 1
  • 17
  • 19
27
votes
4 answers

get latitude & longitude as per address given for leaflet

In my project I am using leaflet to display points. I am getting address from my database & want to show point for that particular address. I haven't found anything which will give me latitude & longitude as per address provided. Can anyone help…
vaibhav shah
  • 4,939
  • 19
  • 58
  • 96
26
votes
6 answers

Leaflet: adjust popup to picture size

I'm trying to include pictures in my leaflet popups, but the popup-size doesn't adjust to the picture size. I found a solution to this on github: https://github.com/Leaflet/Leaflet/issues/724 While that solution fixes the size of the popup, the…
Klaster
  • 673
  • 1
  • 7
  • 17
26
votes
3 answers

leaflet.js map is not showing up

I am a newbie to leaflet.js. Can anyone help me with debugging the following code? I am trying to show a map on screen but only zoom-in and zoom-out button shows up on Google Chrome and the map screen is empty. …
anandg112
  • 462
  • 2
  • 6
  • 14
26
votes
8 answers

How to save a completed polygon points leaflet.draw to mysql table

I would like to use leaflet.draw to create outlines of regions. I have managed to get this working ok: https://www.mapbox.com/mapbox.js/example/v1.0.0/leaflet-draw/ Now I'd like to save the data for each polygon to a mysql table. Am a little stuck…
user3703511
  • 261
  • 1
  • 3
  • 3
26
votes
2 answers

How to tell when all visible tiles have fully loaded?

Is there an event (or other method) to detect when all visible tiles have been downloaded and displayed with leaflet? (Similar to Google Maps event that is called when all visible map tiles are loaded, but for leaflet instead)
Forest Katsch
  • 1,485
  • 2
  • 15
  • 26
26
votes
1 answer

Leaflet zoom in further and stretch tiles

When I zoom in far enough on my map, the TileLayer disappears and I see a bunch of tiles that say "Map data not yet available". I believe these tiles may be coming from the provider, but I am not sure (I am using ESRI WorldImagery dataset). Is there…
elsurudo
  • 3,579
  • 2
  • 31
  • 48
26
votes
3 answers

Leaflet:: How to check point lies inside/outside of polygon or rectangle

is there is any algorithm to check marker lies inside or outside of Polygon, Rectangle and circle. I tried to write a function using this link. but no success.
user2446592
26
votes
6 answers

How to identify Leaflet's Marker during a `popupopen` event?

when a marker is clicked, I need to execute some code that finds the id corresponding to the marker being clicked , retrieves data from backend API, then adds the newly retrieved data to the content of the popup that will open. The only way that is…
Nyxynyx
  • 61,411
  • 155
  • 482
  • 830
25
votes
4 answers

Adjust size of leaflet map in rmarkdown html

I'd like to change the height and width of leaflet map outputs in html document. Is there a simple way to do this in R markdown without getting into whole CSS business? ```{r} library(leaflet) library(dplyr) m <- leaflet() %>% setView(lng =…
Ken
  • 863
  • 3
  • 13
  • 24
25
votes
4 answers

How do you add marker to map using leaflet map.on('click', function) event handler

I'm trying to use an event handler to add a marker to the map. I can manage this with a callback function, but not when I separate the function from the event handler. Callback (http://fiddle.jshell.net/rhewitt/U6Gaa/7/): map.on('click',…
Roy
  • 1,468
  • 4
  • 21
  • 40
24
votes
1 answer

Is it possible to switch between multiple legends when switching between base groups?

I am visualizing some vector data using leaflet in r which has multiple non-spatial variables that a user might be interested in. I want to allow the user to select one variable that will determine the color of the features. I accomplish this with…
Joe
  • 3,831
  • 4
  • 28
  • 44
24
votes
4 answers

L is not defined error with Leaflet

I'm trying to setup leaflet and following the quick start guide on their site. However, I keep getting an error of... Uncaught ReferenceError: L is not defined at initmap (main.js:10) at main.js:6 It seems like an import issue, but I'm stuck. I've…
Carson
  • 1,147
  • 5
  • 19
  • 41