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
24
votes
4 answers

Leaflet Awesome-Markers (Adding Numbers)

I am using the Leaflet.Awesome-Markers plugin with LeafletJS. I have implemented it correctly, however now I'd like to be able to use numbers from 0 - 9 to represent markers. Here's a JS Fiddle implementation to show how the plugin…
gotnull
  • 26,454
  • 22
  • 137
  • 203
24
votes
4 answers

Get a list of markers/layers within current map bounds in Leaflet

This is somewhat similar to the question asked here -- I'm writing a search box for a map application, which retrieves a whole set of search results (people's names & info) at once from a server and then pages through the list of results. So at any…
Tim S
  • 371
  • 1
  • 2
  • 6
24
votes
10 answers

Leaflet map not showing properly in bootstrap 3.0 modal

i have a big problem. i want to open a leaflet map in a modal. but the map is not showing properly. the tiles are not loading. here is the script: https://codeply.com/p/TYUqgVvYAQ
user2975100
  • 267
  • 1
  • 4
  • 9
24
votes
5 answers

How do I get the latlng after the dragend event in leaflet?

I'm trying to update the lat/lng value of a marker after it is moved. The example provided uses a popup window to display the lat/lng. I have a "dragend" event listener for the marker, but when I alert the value of e.latlng it returns…
Roy
  • 1,468
  • 4
  • 21
  • 40
23
votes
2 answers

React Native Webview with openlayers

I have seen this info: https://stackshare.io/stackups/leaflet-vs-mapbox-vs-openlayers I'm developing at the same time a web application with react using OpenLayers. And I have to make the same app on mobile using react native but I don't know how to…
Javier
  • 231
  • 2
  • 4
23
votes
3 answers

Calculate distance between two points in Leaflet

How do you calculate the distance between two markers in Leaflet-ionic2? Couldn't figure out, I hope there is an Algorithme to do as soon as i select a marker it show me the distance between my location and the marker. Thanks..
Taieb
  • 920
  • 3
  • 16
  • 37
23
votes
5 answers

Change color of leaflet marker

Is there anyway to change the color of leaflet marker base on the value of some variable. In the following map, for example, I wish to assign marker color based on mag variable: library(leaflet) data(quakes) # Show first 20 rows from the `quakes`…
M.Qasim
  • 1,827
  • 4
  • 33
  • 58
23
votes
2 answers

Popup when hover with leaflet in R?

My leaflet map looks something like this: library(sp) library(leaflet) circleFun <- function(center = c(0,0),diameter = 1, npoints = 100){ r = diameter / 2 tt <- seq(0,2*pi,length.out = npoints) xx <- center[1] + r * cos(tt) yy <- center[2]…
Ignacio
  • 7,646
  • 16
  • 60
  • 113
23
votes
3 answers

leafletjs marker bindpopup() with options

The leaflet documention shows you can add a popup to a marker with marker.bindPopup("Hello world!
I am a popup.").openPopup(); or create a standalone popup with var popup = L.popup() .setLatLng([51.5, -0.09]) .setContent("I am a…
nexus_6
  • 353
  • 1
  • 2
  • 7
23
votes
2 answers

How to add markers bulk in leaflet?

I have an array with ~30k elements and I need to create map with markers for each of them. I use markerclusters and trying to optimize adding moment. for (var i = 0; i < myItems.length; i++) { var item = myItems[i]; marker = new…
Egor Sazanovich
  • 4,979
  • 5
  • 23
  • 37
23
votes
3 answers

How to make offline maps(using leaflet OSM) , by caching?

I am trying to make offline maps through caching (IndexedDB) in browser. I understand the concept is that I download and store the tiles of map first when connected to internet. Then I have to load the tiles logically offline. However, I'm not able…
Abhi Ram A
  • 305
  • 2
  • 4
  • 10
23
votes
4 answers

Coordinates of Leaflet.Draw rectangle

Is it possible to get the coordinates of the rectangle on mouseClick, so I have all the corners of the rectangle?
mortenstarck
  • 2,713
  • 8
  • 43
  • 76
23
votes
4 answers

leaflet layer control events?

All, I want to detect user layer selection in order to synchronize my sidebar with the displayed layers. But I don't see any layer control events in the API reference; How might I tell when such user layer selection has occurred? As an…
user1032402
  • 410
  • 1
  • 3
  • 11
22
votes
3 answers

Leaflet.js: Use ctrl + scroll to zoom the map & Move map with two fingers on mobile

I'm using http://leafletjs.com/ ... is it possible to only: Use ctrl + scroll to zoom the map Move map with two fingers on mobile/tablet ... so similar what google maps does? With the comments ... So far thats my setup: // Leaflet Maps var…
Philipp M
  • 3,306
  • 5
  • 36
  • 90
22
votes
3 answers

Mapbox tiles and Leafletjs

I'm trying to load some additional tile layers on my map but I can't quite figure it out. The ones that I currently have I only have thanks to someone that provided a tutorial but didn't say what the other tile options were. Can someone help me…
twg_
  • 995
  • 2
  • 7
  • 15