All Questions
1,096
questions
0
votes
0
answers
35
views
How to wrap the VideoOverlay component in react-leaflet with a div?
I'm currently working on integrating a video overlay onto a map using the react-leaflet library. I'm using the VideoOverlay component provided by react-leaflet to render the video onto the map ...
- 1,052
3
votes
1
answer
1k
views
React leaflet side-by-side
I wanted to show two tile layers side by side, like the plugin side-by-side for leaflet (https://github.com/digidem/leaflet-side-by-side).
However, I am not sure how to do this with react. Is there ...
- 12.6k
0
votes
1
answer
103
views
Why whenever i call MapContainer I always get "React-leaflet Error: Dispatcher is null"?
I am at my first experiments with React-Leaflet, so after installing everything i treid to add a simple map in my React App, but whenever i call MapContainer the only thing I obtain is this error log:
...
- 1
1
vote
1
answer
339
views
How can I access the map object since the whenCreated prop was removed in react-leaflet v4.x?
I have been struggling with an issue which comes down to me not being able to properly reference the map object. After researching it for a few days, I've come to the conclusion that the "old&...
- 6,000
0
votes
0
answers
80
views
How to Implement Tile Caching for Leaflet in React?
I'm currently working on a project using React with Leaflet for mapping functionality. I've been exploring options to optimize performance, and one area I'm interested in is caching Leaflet tiles to ...
- 202
0
votes
1
answer
112
views
Auto pan and update map position when data inside Popup changes
I have some dynamic data inside <Popup> that will change the Popup box size after opening. When you first click on the <Marker> it will update the content, position and adjust the pan of ...
- 6,000
0
votes
1
answer
232
views
React Leaflet divIcon with clickable button
In react-leaflet, I am trying to add a draggable button to the map as shown in the image below. I also want the rest of the div to be non-clickable.
However, when I click the button, nothing happens.
...
- 6,000
0
votes
0
answers
18
views
How to add the toolbar in leaflet [duplicate]
I want to add the leaflet toolbar like below in the MapContainer, would you please help ?
<MapContainer
id='mymap'
center={[65, 300]}
zoom={1}
zoomControl={true}
doubleClickZoom={false}
...
- 1,341
0
votes
0
answers
113
views
Create A Polar Coordinates Grid using react-leaflet
I am currently working on a react component that could potentially create a Polar coordinates grid.
In my React Project, i have to display on top of OSM (Open Street Map) two types of Grids (...
0
votes
0
answers
17
views
React Leaflet NextJS - interactive bug map (unsynchronized images) [duplicate]
I have a small problem, I use leaflet react, but I have this kind of rendering
The first zoom is perfect in itself (complete image, but weird contour), but as soon as I switch to Zoom 1, 2, 3..., I ...
- 18.9k
0
votes
1
answer
81
views
React-Leaflet: updating a marker's position every second fetching the coordinates from an .env file
I'm running a simple react-lefleat map on small http server running on an Arduino board and I would like to update a marker's position (my position) according to the coordinates extraced by the ...
0
votes
1
answer
58
views
Leaflet mosaic TileLayer
I want to use leaflet reactjs and i want to do it on an image.
the prblm is that the image is shown as mosaic.
<div className="bg-white w-auto m-2 h-[calc(635px-10rem)] border-2 border-gray-...
- 18.9k
5
votes
3
answers
8k
views
react-leaflet create a custom components
I would like to create a custom component with react-leaflet that shows the actual position (x,y) of the mouse, but I don't know how to create it. I found react-leaflet-control but it seems that it is ...
- 81
0
votes
1
answer
115
views
React Leaflet Material UI divIcon not styled
In React Leaflet, I am trying to use divIcon to render a custom Material UI marker that takes in a background color prop. However, when the marker is used in leaflet, the background style is not ...
- 51
16
votes
4
answers
19k
views
React leaflet center attribute does not change when the center state changes
App.js
import { useState } from 'react';
const App = () => {
// This state is used to the center attribute of MapContainer component
const [mapCenter, setMapCenter] = useState([34.80746, -40....
- 179