Stack Overflow
Stack Overflow

Questions tagged [google-map-react]

87 questions
2
votes
1 answer

How I can make a static map with google-map-react in react?

I have this : What props can I pass you?…
lautaro
  • 43
  • 1
  • 6
2
votes
0 answers

'google-map-react' Polyline fails to draw because of poorly managed React state

Being very new to React TS, I'd like some help on managing the sessionEntity variable. I load data from DB using a function called getEntity(). On dev env. the code below works just fine. On prod environment where I expect loading data takes a…
Mohamed Taher Alrefaie
  • 15,698
  • 9
  • 48
  • 66
2
votes
1 answer

Google Maps Javascript API throwing InvalidKeyMapError on Production

My code is working fine on localhost, I am using google-map-react package to render map on my react app but when i merged the code in QA or PROD environment the map gets loaded for a second and then it says error and when i check the console windows…
Minks
  • 55
  • 1
  • 2
  • 10
2
votes
0 answers

Can't properly instanciate a Google Map when using pagination

I've been struggling a lot lately with the pagination of a list. The issue Each element of that list contains a tiny map and several other information. That list was displaying the map of each row the right way without pagination but I have…
Tupac
  • 73
  • 1
  • 6
2
votes
2 answers

How get marker position on dragend in React (google-map-react )

Hello Guys how can I get the coordinates (Long and lat ) on the dragend-event when I put the marker on the map? I'm using google-map-react to render the Map currently Thanks This is the Marker Component I currently want to render: import React, {…
kyrillos ezzat
  • 55
  • 1
  • 7
2
votes
1 answer

google map react, from onGoogleApiLoaded apiIsLoaded doesn't called

Function apiIsLoaded doesn't get called, and map can't be initialized. What's wrong? When inspecting, I can see a div without a google map iframe, just empty space. I need to apiIsLoaded be called, but cant find any way to do this. Here is the code,…
Amalia
  • 33
  • 2
  • 6
2
votes
1 answer

google-map-react not showing up

I am trying to implement google-map-react but the map is not showing up and I couldn't find the answer to my problem. I have set both height and width and markers are showing up but the map is not. Any idea? What I see on screen:…
Javi Rando
  • 113
  • 1
  • 6
2
votes
1 answer

google-map-react centering the map with multiple markers

How do I find the center of the map when I have more than 2 markers? When I have only 2 I've done it like this: midPoint(trackingLocation, deliveryLocation) { if (deliveryLocation) { return [ trackingLocation.lat +…
Mauro74
  • 4,686
  • 15
  • 58
  • 80
2
votes
0 answers

Filtering markers on Google Map based on radius using React Api google-map-react

I'm trying to display markers based on provided radius- I'm unable to develop a logic for that. your help would appreciated following is simple react component which displays the array of markers. MY problem: I dont know how to use radius property…
Yasir Ali
  • 21
  • 1
1
vote
1 answer

Issue with google-map-react package - Unable to set custom center coordinates

This component passes in the address then uses another API to get the latitude and longitude. The latitude and longitude are then passed into the google-map-react API to be converted into a map. But I'm unable to set custom center coordinates for…
ccy
  • 27
  • 4
1
vote
1 answer

Custom Maker Icon not Scaling down with scaledSize attribute in @react-google-maps/api library

I have used the @react-google-maps/api library to add a google map and show some custom marker icons on the google map. I have followed the documentation found in here. And added a marker. I have successfully able to show my list of custom markers…
Cham
  • 787
  • 3
  • 11
  • 25
1
vote
0 answers

React Google Maps API Key Not Translating

I am trying to implement the simple example shown on the google-map-react npm website found here, https://www.npmjs.com/package/google-map-react, but I can't seem to get the API key to translate onto the request URL. When my component loads in the…
LuckyPierre
  • 31
  • 4
1
vote
1 answer

Use google-map-react fitbounds useRef -> mapRef.current.fitBounds is not a function

I use google-map-react and I want to have the correct zoom and center to the map. To center the map I use the props center on GoogleMapReact component that I can calculate. But for the zoom it is more complex. I could see the use of fitBounds but…
Lucas Bodin
  • 311
  • 3
  • 19
1
vote
0 answers

TypeError: Cannot read properties of undefined (reading 'lat') using React version-18 @react-google-maps/api with Rapid Api

I am new to React Google Maps. I am using this library to create a map with several locations and trying fit the boundaries and center it. I am using it to locate restaurants, hotels and all on that particular location. This is my code in which i am…
Gaurav
  • 11
  • 2
1
vote
1 answer

useState not update variable

I'm using google-map-react to display places on google map with auto-suggestion feature, following example here: https://www.freakyjolly.com/google-maps-in-react-example-application. I'm using Typescript so my code is different from the blog. I'm…
Yang Liu
  • 541
  • 9
  • 26
1
2
3 4 5 6