Stack Overflow
Stack Overflow

Questions tagged [react-leaflet-v3]

React components for leaflet maps. Use this tag for questions related to version 3 of react-leaflet only.

86 questions
1
vote
0 answers

Leaflet : Suddenly I'm getting this error message: Failed to load resource: the server responded with a status of 403 ()

Suddenly I'm getting this error message, strange to me since I haven't been touching the map part : Failed to load resource: the server responded with a status of 403 () Searching for a clue I found this outdated…
Raphael10
  • 2,508
  • 7
  • 22
  • 50
1
vote
0 answers

how to use react-leaflet with preact

I am trying to use react-leaflet with preact with little success. I do actually render the map but it is not rendered together, as in the tiles are scattered over the page and outside the containing element. I have read all (some) related questions…
cbutler
  • 1,111
  • 5
  • 16
  • 32
1
vote
1 answer

How to get an object out of a useState array?

I have a table with a row that has a checkbox, and I have an object called an ellipse. I need to make the ellipse object to enter the savedEllipse array (which uses useState) as soon as I click on the checkbox. In the test I did, I see that the…
Mike Hemilton
  • 91
  • 1
  • 13
1
vote
1 answer

Custom icons for MarkerClusters in React Leaflet

I am trying to implement a custom icon for my markerclusters (instead of the regular circular clusters). I referred to the link and implemented as shown in the code below: https://www.npmjs.com/package/react-leaflet-markercluster import { divIcon,…
Aahana B.
  • 23
  • 7
1
vote
0 answers

How to remove geojson component from mapcontainer

const MyData = () => { // create state variable to hold data when it is fetched const [data, setData] = React.useState(); // useEffect to fetch data on mount useEffect(() => { // async function! const getData = async () => { …
user1361488
  • 83
  • 7
1
vote
0 answers

React Leaflet - setState fired twice

I have the following code which renders a React Leaflet v3 map and allows users to construct a route by clicking at various points on the map. The total route distance is displayed below the map. interface RouteProps { updateDistance: (d: number)…
Ian A
  • 5,622
  • 2
  • 22
  • 31
1
vote
1 answer

Redux Toolkit `useAppSelector` value causes render when it isn't updated

Background The title may be confusing, but to explain, I am using slices with Redux Toolkit in order to manage state. These slices hold various state values for my map application. Specifically, two that I'm having issues with renders is a clicked…
c-mcb92
  • 170
  • 1
  • 9
1
vote
1 answer

React Leaflet v3 : Good way to create a control

I'm displaying a map with react leaflet v3 in my react app. I just want to add a custom control, but I can't figure out what's the good way to do that. Actually, i do it like that, but it seems to be not working. function DptCtl(props) { //…
Damien STEPHAN
  • 113
  • 1
  • 9
1
vote
1 answer

React-Leaflet-v3 Reusable Custom Control

Background For React Leaflet v2, there was an NPM plugin, react-leaflet-control, that allowed you to create any kind of control and place it into the react-leaflet control container. Obviously with the introduction of RL-v3, this no longer works in…
c-mcb92
  • 170
  • 1
  • 9
1
vote
2 answers

react leaflet have a broken marker

I have imported Leaflet module along with some code to delete the Icon. import L from "leaflet"; import { Map, TileLayer, Marker, Popup } from "react-leaflet"; import "leaflet/dist/leaflet.css"; delete…
Sai Krishnadas
  • 2,863
  • 9
  • 36
  • 69
1
vote
0 answers

Clearing markers in cluster before update in Leaflet Marker Cluster react way

I am using react-leaflet and leaflet.markercluster to create custom MarkerCluster component. The idea is to pass Markers as children to MarkerCluster component. Markers are React components as well. I want to update my markers dynamically, meaning…
Andyally
  • 863
  • 1
  • 9
  • 22
1
vote
1 answer

React-Leaflet: How to clear a Feature Group and add new components using state?

I'm relatively new to react-leaflet and react and am having trouble drawing new components on my map. I've been stuck for a week now so hoping someone can help. I'm attempting to clear the components (layers?) from a Feature Group on the map then…
just_Mango
  • 117
  • 1
  • 7
1
vote
2 answers

Updating the Chloropleth Tutorial to react-leaflet v3 With Function React Components

I was wondering if anyone knew how to update this tutorial (https://leafletjs.com/examples/choropleth/) to work with react-leaflet v3 as well as react function components. The parts I can't get working is resetting the GeoJSON style when you mouse…
briyoon
  • 75
  • 1
  • 7
1
vote
0 answers

Deleting current layer when a new layer is created with react-leaflet-draw version 0.19.8 in leaflet version 1.7.1 and react-leaflet version 2.8.3

I used the solution in this question (Delete layer before creating a new one with react-leaflet-draw in leaflet) to gain ability to draw only one shape(layer) in React and Typescript map project, but I got cannot read propery leafletElement of…
Abolfazl Heidarpour
  • 125
  • 1
  • 8
1
vote
1 answer

React-leaflet V3 Polyline animation

I am creating a Polyline component using two positions with Typescript based on the react-leaflet. I want to make an animation from the source to the destination. It should look like something is flowing between source to destination. I'm able to…
sandy
  • 283
  • 1
  • 7
  • 27
1
2
3 4 5 6