All Questions
Tagged with leaflet google-maps-markers
333
questions
0
votes
0
answers
32
views
How to link to marker on Leaflet map from another URL
This works perfectly for activating a popup on a leaflet map on the same page:
{<a class="mplk" href="#where" onclick="t5.fire('click')">See on map</a>}.
The ...
0
votes
1
answer
50
views
Leaftlet divIcon with clickable button
I'm working on leaflet and I wanted to add click event for a icon in the custom divIcon as below,
If user clicks on the edit(pencile) icon then click event should trigger,
Here is the code I'm ...
- 200
0
votes
2
answers
42
views
In chrome, The pin is placed somewhere other than where click on leaflet
I have a leaflet map in an html page (I put my code below). When I open it in chrome browser and click on the map, it puts the pin somewhere other than where I clicked. But it works fine in FF browser....
0
votes
0
answers
74
views
Leaflet js - How can I change marker icon dynamically according to some conditions present in the database?
I have a list of places in a MySql database (with id, latitude, longitude, counter, timestamp). To add them to the map I make an asynchronous call to a php file where there is a search query. Places ...
0
votes
0
answers
33
views
Prevent interruption of tabbing between Leaflet markers
I can tab with the keyboard between markers in my Leaflet map in Chrome and it nicely displays a rectangle around the selected marker and displays its tooltip. If I zoom or pan the map with the mouse, ...
- 371
0
votes
1
answer
53
views
leafletjs - How to access the html created inside the marker?
Using leafletjs I created a series of markers on the map, all looping from a JavaScript array. I also added some html, including the "I'm here" button as per the screen. I would like to be ...
0
votes
0
answers
23
views
Make a marker unable to use for a time
I have a map with markers. Every marker is a charging station. I want that the user that want to use the charging station, can book the place for an hour for example and set a time that is shown. When ...
- 1
0
votes
0
answers
81
views
change marker color based on properties
This is my first time here on stackoverflow. I have a doubt. I marked some markers on my map (I used OpenStreetMap). On each marker I put a drop-down menu with choices. Based on these choices, the ...
- 1
0
votes
1
answer
84
views
customized marker for leaflet locate control plugin does'nt appear
I created a customized marker for leaflet locate control and inserted it with this code
/*button to turn on GPS*/
//function from leaflet locate control (plugin)
L.Control....
- 87
0
votes
0
answers
30
views
Different colored icon for different Layer groups with popup
I am trying to use an example of Layer Groups and Layers Control from https://leafletjs.com for my website. My code is as under. I want to use different colored icons for different layer groups.
<!...
- 99
0
votes
0
answers
32
views
Trouble Adding Nearby Wikipedia Markers to Leaflet Map Using OpenCage Geocoding API
I'm working on a web project where I'm trying to add nearby Wikipedia markers to a Leaflet map based on geolocation data. I'm using the OpenCage Geocoding API to obtain latitude and longitude ...
0
votes
0
answers
203
views
How to use Fancybox 5 to show a photo when clicking a Leaflet marker
Is this possible at all?
This is my code so far
var marker = L.geoJSON(geojsonFeatureCamera, {
pointToLayer: function (feature, latlng) {
return L.circleMarker(latlng, ...
- 1
0
votes
1
answer
435
views
How to add Markes to a Leaflet-map with coordinates from database in Next.js?
I have to display markers for all the places in my database. At the moment I can display just one marker.
I maped over the array from database but I do not know how to connecte these two. I would ...
- 1
0
votes
1
answer
104
views
How to prevent openning a popup when you choose a layer to show in leaflet?
I'm a working on a project with leaflet where a it shows three layer
you can enable o disable whenever you want to display all the markers from that layer.
Every marker has a popup that it opens when ...
- 31
2
votes
0
answers
93
views
How can i add am option box into my Folium Draw Toolbar?
I'm working on a proyect where i use Folium and plugin.drawn in order to handle markers and polygons,
The idea it is simple, save all markers en polygons created on the map. It is a collaborative map
...
- 31
0
votes
0
answers
324
views
Remove marker is disabled after one marker remove from map
I am using the react-leaflet/core library together with the plugin Leaflet-Geoman which using the removalMode to delete the marker from map
Below is my code
import { useLeafletContext } from "@...
- 37
-2
votes
1
answer
182
views
I'm tring to code to get a popup marker on my leaflet map when I double click on the map
I want to get a popup marker(by image) on my map every time I double click on the screen. Every time I try to copy other's code, it won't work. Can someone help plz?THE MARKER NEEDS TO BE AN IMAGE!
I ...
-1
votes
2
answers
68
views
Have to click 2 times before it opens my component
GM,
I am a beginner in Angular, i use Leaflet for my application.
I created some markers, and i want to open another component when i click on the marker.
This is the marker click
marker.on('click', ()...
- 65
1
vote
0
answers
36
views
Need to disable deleting a marker layer in leaflet
I am working with a leaflet map that uses a custom image, draws rectangles on it with markers and tooltips at the center of each rectangle.
It includes a toolbar that sets a delete mode. In the ...
1
vote
0
answers
905
views
Add one Marker to Multiple FeatureGroups in Folium Python
I'm trying to make a map in python using Folium to show the location of some facilities. Each facility might have several features which I want to use to filter the markers. As far as I know it's ...
- 170
0
votes
0
answers
416
views
Leaflet Rotate Only Shadow of an Icon
I need a way to rotate only the shadow of the icon which is linked to my marker.
I'm using this plugin for rotation : https://github.com/hanying33/Leaflet.RotatedMarkerWithShadow
The example below ...
1
vote
0
answers
422
views
Leaflet Control Search: Search only markers which are currently visible on the map
I am working on my first project using Leaflet javascript library. After succesfully importing a geoJSON file on the map, I am trying to create a new geoJSON layer (currShownMarkersLayer), populated ...
- 11
0
votes
1
answer
809
views
styling leaflet markers according to property in geojson file
I´m completly stuck with this part. I have tryed a lot of solutions I have found here and on other places but I simply can´t figure out the situation.
I´m trying to place markers on a map according to ...
- 27
0
votes
1
answer
847
views
search markers with leaflet search
I´m trying to use leaftlet search but it doesnt find the markers.
The markers are populated on the map as it should be, but the search wont work.
I have a freg.js file where I have the information to ...
- 27
0
votes
1
answer
148
views
MapQuest, Leaflet - disable marker on directions layer
Is there a way to hide markers generated at directions layer ? I'd like to draw only route.
Or is there a way to set custom icon instead of build ones ?
According to docs:
https://developer.mapquest....
- 23
0
votes
1
answer
505
views
How to simply change marker icon on click and then back to original state when click elsewhere?
I'm trying to get this function on my custom map https://rodadagua.netlify.app/
I've found some very close examples and questions on here but being a complete novice unfortunately I have no idea what ...
- 1
0
votes
1
answer
791
views
Find the middle point between two markers in Leaflet
I would like to be able to find the centre point between two markers on a map (example below). Is there a function in leaflet or in another package that allows this? Thank you in advance
coor_zone6 &...
- 21
1
vote
0
answers
61
views
Leaflet with Edge Canary (recent version) mouse and markers glitch gap shift
With recent release of Microsoft Edge Canary version (as of date 2/May/2022, version 102.0.1243.0)
it seems like when moving the mouse it is and hovering over a marker there is a gap between the place ...
- 11
1
vote
1
answer
219
views
Having Leaflet markers visible in more than one layer
I want some of my Leaflet markers visible in more than one layer on my Openstreetmap map.
By example: London is harbor and is also a capital city.
So I want to see the London marker when I select only ...
- 193
0
votes
0
answers
125
views
[React][React-Leaflet] Updating position after changing radius
I am working on a React-app to find a soccer club near the user position, I want to let the user change the radius around him in order to find some results in his area.
So for now the default value of ...
- 3
1
vote
2
answers
1k
views
Counting markers in a layer in leaflet and add it to a div
I have a Leaflet map with markers and filters (checkboxes) and I would like to count the number of markers as the filters change.
I added this code which I found here Getting the count of markers in a ...
- 13
0
votes
1
answer
565
views
Leaflet map with geojson data. Popup with no information
I created a map in Leaflet and I have GeoJSON data. I added my data to my map. But on the map, there are only points with no information when I click on them. I tried to add use this :
var marker = L....
- 1
0
votes
0
answers
325
views
Angular Leaflet add numbers to custom iconUrl markers
I want to add numbered markers in Leaflet map ,
though Im using custom images as markers iconUrls ,
the numbers doesn't feet with the custom icons
this is my code.
this.marker1 = marker([...
1
vote
1
answer
281
views
Trouble using the leaflet package to make an interactive map using the us.cities package
I am trying to make an interactive graph of the United States using leaflet and the us.cities package in R. I was able to create the map and label put markers on all the US capitals, but I am ...
0
votes
2
answers
372
views
Customizing Leaflet Icon
I need to add 2 different marker icon in leaflet. The one is world heritage site and other for earthquake. The URL for earthquake icon is:
var earthquakeicon = L.icon({
iconUrl: 'https://previews....
- 171
0
votes
0
answers
2k
views
React-Leaflet custom markers with condition
Hej!
I'm very new to leaflet and react and have an issue changing the icon of the marker based on a condition.
I want different colored markers based on the project and set the opacity based on the ...
- 158
0
votes
1
answer
476
views
How to remove marker when click button
I am creating a Leaflet Map Widget using Preact and webpack.
I have 3 buttons with a single map. Below images shows what I implemented.
when click one single button, the map will show some locations. ...
- 490
3
votes
1
answer
159
views
leaflet: removeLayer() work only once in JavaScript
this is the my Map ,my removeLayer in leaflet map remove once (remove Picture ) and as you see in picture it remove marker perfectly but when i try to remove it again it don't!
check is not true but ...
0
votes
1
answer
1k
views
Is it possible to display react leafletjs markers on specific zoom levels?
I'm using react Leaflet js map, and I'm displaying markers of fetched data from my database on the map, but the issue is that I have kind of 5000 markers and it's a lot to display on zoom level 9, so ...
- 541
0
votes
0
answers
134
views
Fit tootltip in Leaflet map window after flyto()
When I flyto() to marker and openTooltip() on it, the marker turn up on center point of map area, and part of the Tooltip turn up is outside the map-window. How make flyto() centered on Tooltip ...
2
votes
1
answer
1k
views
R Shiny with Leaflet - change color of marker after click
I am developing a Shiny app that shows a Leaflet map with markers.
The markers are clickable and I collect the IDs of the clicked markers.
But I also want to change the color of a clicked marker. When ...
- 2,551
0
votes
1
answer
1k
views
Cannot remove layer or clear all layers on leaflet with markercluster?
I am having a problem permanently removing layers or markers with leaflet marker cluster.
I can remove remove the marker and edit its CSS via its DIV ID fine. When I do it this way and delete the ...
- 23
0
votes
1
answer
81
views
Problem looping through marker.layers and changing only one CCS layer properties
I have several markers on a map. They load and add and remove well but I cant change one CSS element on just one marker, I can find the layerm. If I loop through the layers but find the correct one ...
- 23
1
vote
1
answer
745
views
Marker position changes with higher zoom level on leaflet map with custom tiles
I transformed an image into maptiles with max zoomlevel of 6. There are several markers on this map. Until zoom level 4 everything is ok. With zoom level > 5 the marker position changes.
I use CRS....
0
votes
0
answers
80
views
How to make custom text ID appear at the center of marker a icon in Leafletjs
Am working with LeafletJS web mapping library where I want my point ID/text to appear centered on the marker icons.
This is what I wanted, my point text on the the marker icons like this:-
I tried ...
- 964
3
votes
1
answer
830
views
leaflet marker popup opening and immediately closing
In my leaflet map, clicking on a marker opens its popup and immediately closes it.
Logging of map events reveals that instead of firing just a popupopen event, the click on the marker triggers 2 ...
- 1,043
0
votes
0
answers
632
views
Why is my icon showing up as an empty square with Leaflet JS?
I'm trying to make my point marker have a picture icon, but for some reason, it's showing up on my map like this:
I've looked at the documentation on leaflet's website and what not but have had no ...
- 17
0
votes
1
answer
77
views
Is there a cleaner way to code multiple markers on a leaflet map in Javascript?
I currently have 6 individually coded markers on my leaflet map in javascript. I was wondering if there was a cleaner way to code all these and just change the coordinates? (Below is an example of 2 ...
0
votes
1
answer
395
views
Dragging map to the selected marker from the list line leaflet map
If I am on the list of agencies, and each time I click on the agency line, it will slide on the map to marker.
In this case, it do jump not drag on the map:
$("#myTable tr").hover(function ()...
- 51
0
votes
1
answer
403
views
Keep Getting this.callInitHooks error (Leaflet)
I'm trying to add markers and a search bar to my leaflet choropleth map. However, I keep running into an error that tells me: Uncaught TypeError: this.callInitHooks is not a function. It comes from my ...
