All Questions
111
questions
88
votes
18
answers
78k
views
How to fix error "Failed to compile : ./node_modules/@react-leaflet/core/esm/path.js 10:41 Module parse failed: Unexpected token (10:41)"
I am trying to create a react-typescript app along with leaflet. I used the command,
npm install leaflet react-leaflet @types/react @types/leaflet --save to install the dependencies.
But when I start ...
- 2,028
23
votes
3
answers
17k
views
How do you call fitBounds() when using leaflet-react?
I cannot figure out how to call fitBounds() on the Leaflet map.
If I was just using vanilla leaflet, this solution would work perfectly: Zoom to fit all markers in Mapbox or Leaflet
Unfortunately, I ...
- 591
57
votes
7
answers
99k
views
Leaflet: Map container not found
I have the below react class which fetches the geolocation through the browser.
I am mapping a leaflet map. I want to geolocation to be an input to the setView, for such that the map "zooms" into the ...
- 6,979
17
votes
3
answers
40k
views
React Leaflet: Add markers dynamically
How to add markers dynamically to React-Leaflet maps?
I want to add new markers when user clicks on map. And I cannot get it work.
import React, { Component } from 'react'
import { render } from '...
- 2,232
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....
- 161
8
votes
1
answer
6k
views
React-leaflet geojson onEachFeature popup with custom react component
I am trying to render custom react component in react-leaflet GeoJSON onEachFeature popup, e.g. to fire modal with all corresponding feature.properties. In a popup react-leaflet component it works ...
- 83
3
votes
2
answers
4k
views
React leaflet and react-leaflet-draw
I'm trying to implement the draw functions on leaflet map. I've created a new app with only react-leaflet installed, using npx create-react-app and the following packages installed:
npm install react ...
- 5,033
3
votes
2
answers
6k
views
Is there a way to use leaflet.heat in react?
I am trying to use leaflet.heat in reactJS. I have already made leaflet library to work with react hooks but unfortunately I can't use leaflet.heat in react. I import the module like:
import "../...
- 2,645
68
votes
4
answers
71k
views
Is it ok to use ReactDOMServer.renderToString in the browser in areas where React isn't directly managing the DOM?
I'm working on an app using Leaflet (via react-leaflet). Leaflet directly manipulates the DOM. The react-leaflet library doesn't change that, it just gives you React components that you can use to ...
- 2,213
12
votes
2
answers
14k
views
How to get bounds with react-leaflet
I want to get bounds of the current map so that I can search those bounds with the Overpass API.
For leaflet I know the method is just map.getBounds(), but I don't know how to implement that in react-...
- 337
3
votes
1
answer
5k
views
Leaflet _ ReactJS - Where to find the invalidateSize property?
I have tried to find it in:
this.mapRef.current.leafletElement
this.mapRef.current.getLeafletElement()
invalidating this.mapRef.current.getLeafletElement().invalidateSize
this.mapRef.current....
- 11.3k
3
votes
3
answers
9k
views
Adding 'onClick' function to a MapContainer from 'react-leaflet' in typescript file
In a Typescript file, I can t import 'Map' from 'react-leaflet' and easily fixed it with 'MapContainer'. However, I need to add an 'onClick' function to it, but 'MapContainer' does not support '...
- 171
91
votes
19
answers
85k
views
react-leaflet map not correctly displayed
I'm trying to use react-leaflet to display a map. I use the code from this fiddle which is working, but on my computer I have this output
Here is my code :
DeviceMap.js
import React from 'react'
...
- 11.8k
21
votes
7
answers
41k
views
How to include "leaflet.css" in a React app with webpack?
I using the survivejs.com site as a template to build a map based React app with webpack. For the map i am using leaflet but i can't find a way to add the leaflet.css. Without this the map tiles are ...
- 691
15
votes
4
answers
11k
views
Leaflet React get map instance in functional component
I want to have a button outside the map that changes the view to another coordinates.
Is there any way to get mapContainer instance to call their functions? Or how can I implement that function?
I ...
- 287