Questions tagged [leaflet-plugins]

The tag has no usage guidance.

Filter by
Sorted by
Tagged with
1
vote
0answers
41 views

Finding closest marker to user location Leaflet KNN

I am using Leaflet KNN and would like the closest station to a users location, from the web browser, to have a pop up saying it is their closest station. How can I find the nearest marker to the user ...
0
votes
1answer
33 views

Using large data JSON file in Leaflet markercluster [closed]

I want to show the JSON file consisting of many points on the map using the leaflet marker cluster plugin. My JSON file looks like: [ { "json_featuretype" : "Output", "...
1
vote
0answers
32 views

How to add and delete the Leaflet OpenStreetMap dynamically

I have to place the Leaflet maps to be placed in the bootstrap grids (maps has to place dynamically with the number of elements coming from the backend i.e number of elements = no of Leaflet maps). ....
1
vote
1answer
29 views

Open marker popup show when chosen from list in Leaflet

When I choose a spot from list it zooms in to it but it doesn't open/popup with label/text. Any one knows? suggestions?? This is my code; // - SEARCH ENGINE - // var clusterSpots = L....
0
votes
1answer
37 views

How to add and remove the pop-up text based on the condition by using Leaflet

I want to show and hide the popup text based on the condition given below. .component.ts var insidecirclespace1 = (lat, long) => { for (var i = 0; i < this.sensors.length; i++) { ...
0
votes
0answers
138 views

Cannot access GeoJSON layer in react-leaflet

I am using React Leaflet to render Leaflet map and its GeoJSON component to render polygons. I am trying to implement dragging multiple polygons. I added Leaflet.Path.Drag library and tried to reuse ...
0
votes
0answers
40 views

Creating the Leaflet map offline(load the leaflet tiles without internet)

I have created the Leaflet map which works in online. But now my requirement is to create the Leaflet open street map in offline. How do I load the Leaflet map offline?
2
votes
1answer
132 views

Picking up the coordinates inside this polygon draw

I already have a geojson being consulted and that is plotting these black dots. And then I inserted the leaflet-geoman plugin to give users the freedom to create polygons on the map. Basically draw ...
1
vote
1answer
55 views

Leaflet control window - how to get image & text to appear together in the content of the modal window?

I have implemented leaflet-control-window plugin into my map and it works. Modal opens on marker click and shows text. I need image to go below the text in the window but can't get it to work. When I ...
0
votes
1answer
24 views

Access individual feature properties when running l.esri.find or l.esri.query

Here is what my site looks like: https://brandonlprice.github.io/landrecords/. How can I access the feature properties for a layer when running a find or a query on a layer? I have the the feature....
-1
votes
1answer
65 views

qgis2web basemaps sit on top of all other layers in Leaflet and OpenLayers on webpages

Generating a webpage from a map always elevates the basemap from the bottom (within the QGIS Project) to the top (on the webpage map). This means the additional layers can never be overlaid to fully ...
0
votes
0answers
53 views

Problem with CORS WMS plugin Leaflet-Image

I'm having trouble trying to get my map image with the Leaflet-Image plugin. My code: var map = L.map('map', { preferCanvas: true }).setView([43.42851395329958, -3.668450798388781], 23); ...
0
votes
1answer
51 views

RemoveMarkers() is not working for PruneCluster markers in Leaflet

I have a set of markers clustered with PruneCluster plugin. The data of these markers is rendered from GeoJSON layers, the way to do it is like this: var propsAmp = amphibiens.features var ...
0
votes
0answers
56 views

Interaction of leaflet.browser.print and esri.geosearch

I am using leaflet.browser.print: L.control.browserPrint({ documentTitle:'Verify Me!', closePopupsOnPrint:false }).addTo(map); with an esri geocode search: var searchControl = L.esri....
1
vote
2answers
81 views

Request Multiple WMS for Raster Calculations in Leaflet JS

I need to display in leafletJS a Layer that is the difference of two rasters received from a regular WMS. With the help of this repo I figured out how to manipulate the values of a raster tile in ...
0
votes
0answers
85 views

MBTiles on Leaflet map

I'm trying to use Leaflet.TileLayer.MBTiles with npm. It installs fine but when I do: import { Leaflet.TileLayer.MBTiles } I get the following error: ERROR in ./src/js/index.js 7:16 Module parse ...
1
vote
1answer
114 views

Leaflet.streetlabels with leaflet-side-by-side not working

I was trying to mix some Leaflet Plugins, namely leaflet-side-by-side (https://github.com/digidem/leaflet-side-by-side), Leaflet.streetlabels ( https://github.com/triedeti/Leaflet.streetlabels ), the ...
0
votes
1answer
109 views

Regular-grid-cluster plugin for Leaflet

I am starting with Leaflet and I am trying to use the Regular-grid-cluster plugin with no success. The following code works until the definition of the 'const grid' element. So, I can see the markers ...
1
vote
0answers
80 views

leaflet-kml loads entire KML of 15-20 MB at client browser in one go or in chunks as and when user drags to other locations of country?

I am trying Leaflet KML plugin as below: https://github.com/windycom/leaflet-kml Here is full code: <html> <head> <meta name="viewport" content="width=device-width, ...
0
votes
0answers
31 views

leaflet-kml Lat Lng changes and zoom don't work with KML

I am trying Leaflet KML plugin as below: https://github.com/windycom/leaflet-kml const map = new L.Map('map', { center: new L.LatLng(28.412, 77.317), zoom: 11 }); It works, loads the KML over OSM, ...
0
votes
0answers
17 views

Is there a way to use arbitrary, non “plugin” libraries inside Folium / JupyterLab?

It appears Folium supports certain plugins through folium.plugins Is it possible to use an arbitrary third-party library in Folium / JupyterLab? I want to use sidebar-v2. I know I can generate a map ...
0
votes
0answers
29 views

Make Leaflet MarkerClusters stay open all the time

I use the Leaflet MarkerCluster plugin and when clustering is clicked, previous clustering closes, how can I solve this? How can I keep it open, no matter which cluster is clicked?
1
vote
1answer
170 views

Combine leaflet-tilelayer-mask and Leaflet.TileLayer.ColorFilter plugins

I am trying to color my tileLayer mask differently and I found the colorFilter plugin. I can't seem to figure how to use the color filter tile created in my mask tileLayer. let map = L.map("map&...
0
votes
0answers
123 views

Leaflet Control Search, search locations by Ajax request its loading no found

Leaflet Control Search, search locations by Ajax request its loading no found <?php defined('BASEPATH') OR exit('No direct script access allowed'); ?> SIG KSB ...
0
votes
0answers
45 views

Building Leaflet control search plugin in my web [duplicate]

How to build Leaflet control search plugin in my web? I tried but it didn't work. <?php defined('BASEPATH') OR exit('No direct script access allowed'); ?> <!DOCTYPE html> <html> <...
0
votes
0answers
267 views

Leaflet PlayBack

I am trying to animate with the https://github.com/linghuam/Leaflet.TrackPlayBack plugin. I have approximately 100 coordinates and ID numbers defined in each coordinate. Can different symbols be used ...
1
vote
1answer
511 views

Avoiding overlapping charts on a map with Leaflet?

I'm currently developing an online GIS with Leaflet and need to plot bar charts on a map. I'm using leaflet.minichart (https://rte-antares-rpackage.github.io/leaflet.minichart/) for the charts. My ...
1
vote
1answer
461 views

Interactively Display Values of a Heatmap.js leaflet.js Heatmap Layer

In this example of the heatmap.js tool, I see how the values of the heatmap is returned by using heatmapINstance.getValueAt(): demoWrapper.onmousemove = function(ev) { var x = ev.layerX; var y =...
2
votes
0answers
196 views

Cannot add a leaflet.pattern pattern to Leaflet map

I'm using the leaflet.pattern npm package. What am I missing? My Leaflet map is in a Vuejs application. Maybe I need to correct the import statements? import L from "leaflet"; import "leaflet....
0
votes
0answers
82 views

Is there any elevation profile plugin working in MVC5?

I have MVC5 project where I use Mapbox maps to display hiking trails (based on geojson file). Lately, I decided to add elevation profile of these trails to the bottom of the map. However, thats easier ...
2
votes
0answers
194 views

Leaflet: route machine current position

I would like to insert the current position of the device at the first waypoint. With a function onLocationFound I get the position but I can't add it to the waypoint. Does not work. is there a best ...
2
votes
1answer
682 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 ...
1
vote
2answers
1k views

Dynamic map sidebar with info from marker upon click

I am new to Leaflet, HTML, CSS and Java. I am using leaflets maps and I want to create a sidebar that is active when a marker is clicked or active when a clicked in the sidebar, so far I have had no ...
1
vote
1answer
68 views

Changing values of Leaflet MiniMap after creation

I want to change the values of Leaflet MiniMap object after it is already created. e.g. miniMap.options.width: var miniMap = new L.Control.MiniMap( tileLayer01, { centerFixed: new L.LatLng(50.0, ...
2
votes
1answer
446 views

Leaflet combination chloropleth and Leaflet.TimeDimension

Following up the post from Change the colors of polygons on a choropleth map with leaflet I'm wondering if it is possible to combine a Leaflet chloropleth with the Leaflet.TimeDimension so that the ...
2
votes
1answer
537 views

Appending label to every layer in current map bounds using Leaflet

I am trying to reduce the amount of permanent tooltip on my leaflet map for performance reasons. I have over 5000 geoJSON Polygons in my non-geographic map. At a specific zoom level, my Polygons ...
2
votes
2answers
1k views

Loading .json files into Leaflet and filtering them [closed]

I am new to web development and Leaflet/GIS in general. I have a couple of shapefles, let's say they are roads.shp and utilities.shp. And let's say I have the means to convert these shape files into ....
1
vote
1answer
396 views

Leaflet side by side plugin is not working with imageOverlay

I'm trying to use the side by side plugin. I already check in the issues and change the getContainter() with getPane() in the .js file. this._divider.style.left = dividerX + 'px' this.fire('...
2
votes
1answer
1k views

Cutting holes in custom polygon made with Leaflet.Draw

I would like to be able to create holes in polygons made with Leaflet.Draw plugin. For example, I currently have code like this: https://jsfiddle.net/4gkrfu5b/ If you draw a polygon on top of another ...
0
votes
1answer
66 views

Shapefile in leaflet shifted North 0.25°

I have the following problem: I render a bunch of weather maps as PNG overlays with grads and then reproject them from EPSG:4326 to EPSG:3857 to display them in leaflet as follows: gdal_translate -...
0
votes
1answer
346 views

Leaflet - how to add time dimension image layers

Javascript beginner here. I'm working on getting a weather animation done in leaflet. A suitable plugin appears to be leaflet.timedimension but I would be open for other options too. I have 60 PNG ...
0
votes
1answer
459 views

Show time series data with non-contiguous times using Leaflet TimeDimension plugin

My data is made up of squares forming a grid where the value of each square changes with time. The times are equally spaced with 1 hour intervals, however, the data is only available for a certain ...
2
votes
2answers
3k views

Leaflet extension: “this.callInitHooks is not a function”

I am trying to develop a leaflet function but I am getting this error which I am having trouble understanding. This is my plugin code thus far: L.Spotlight = L.Class.extend({ options: { ...