Questions regarding Reactjs component for google maps by tomchentw.
Questions regarding Reactjs component for google maps by tomchentw. https://github.com/tomchentw/react-google-maps.
Questions tagged [react-google-maps]
462 questions
0
votes
1 answer
react-google-maps: trying to create a toggleable infowindow for each marker
I know similar questions have been asked on SO before, but I've tried implementing the solutions in the answers and nothing seems to be working.
So, here's the problem I'm having: I'm using react-google-maps to generate a map. The map has multiple…
MarisolFigueroa
- 757
- 1
- 14
- 31
0
votes
2 answers
React Google Map with DirectionsRendered, how to pass directions props?
I have a problem with react-google-maps map with DirectionRenderer.
I tried to pass directions props in many ways but I always get this error:
InvalidValueError: setDirections: in property routes: not an Array
I defined like below:
state= {
…
batt
- 3,382
- 2
- 11
- 12
0
votes
0 answers
Iterating through props to plot markers in a react google map?
I'm working with React Google Maps. I'm trying to obtain the latitude and longitude coordinates for all my contracts so I can plot each contract as a marker on a Google Map.
This is the code I have that's currently working:
MarisolFigueroa
- 757
- 1
- 14
- 31
0
votes
1 answer
React - Google Map Will Not Load
I am following an online tutorial on implementing React with the Google Maps api. I've been trying to build my map component and I've followed the instructions exactly as they were delivered. However, when I attempt to load my page in a browser,…
Malcolm Ross
- 11
- 1
- 5
0
votes
0 answers
Reactjs state changes twice on render
I'm trying to get my head around Reacts states and I'm wondering if this is expected behaviour or not.
So I have a form and on form submit I trigger a function, this function takes an address and converts it to lat and lng and spits it into a json…
karl
- 321
- 3
- 16
0
votes
1 answer
Cannot read property 'category' of null within return in reactjs
I'm getting some data from a json file and with .map putting those points on a google maps in reactjs, all fine. But some of the items in the object don't have any values and if they get called they throw a: 'TypeError: Cannot read property…
karl
- 321
- 3
- 16
0
votes
1 answer
Multiple info windows in react-google-maps can't pass marker id
I have multiple markers on the map but each time I click a marker to get the info window all the markers info windows open!
I can see what the problem is, I was originally not telling it what window to load. I've tried passing it the index but this…
karl
- 321
- 3
- 16
0
votes
1 answer
What are the required props used for when using withScriptjs HOC
Just started using react-google-maps and would like to know what the required properties loadingElement, containerElement, and mapElement are used for when using the withScriptsjs HOC. Are they strictly used for styling as the examples show? Again…
Los Morales
- 2,061
- 7
- 26
- 42
0
votes
1 answer
Unable to render the Google map on state change
I am trying to change the state of salesPropertyInfoWindowIn by assigning an
array salesPropertyInfoWindowOut that is defined globally.
initial value of
salesPropertyInfoWindowIn :…
Sumit Khatri
- 43
- 3
0
votes
3 answers
How do I pass an element's property to a function in React?
I'd like to pass a property of an element of mine when clicked to the onClick function that I have setup. I don't know how to access the property of the element though.
To be specific, I'd like to pass the position property of my Google Map Marker…
Thunder54
- 55
- 2
- 10
0
votes
1 answer
How to center the viewport from the markers at the first render?
I know with the native Google Map API we can do something like:
const bounds = new google.maps.LatLngBounds();
const marker = new google.maps.Marker({ // wrap that into a loop to add multiple points
position: new google.maps.LatLng(lat, lng),
…
Ludo
- 5,060
- 15
- 53
- 85
0
votes
1 answer
React: Convert HOC const to component
I am using React Google Maps to add Google Maps to my page, and I am setting up the map here:
import React from "react";
import { withScriptjs, withGoogleMap, GoogleMap, Marker } from "react-google-maps";
export const MapWithMarkers =…
user3538055
0
votes
1 answer
Module build failed: provided an invalid property of "__wrapped__"
The react module in question is "react-google-maps", but I guess this is more of a general issue on how to install, uninstall packages.
I have installed this component using the command:
npm install --save react-google-maps
Like it recommends on…
subharb
- 3,374
- 8
- 41
- 72
0
votes
1 answer
React Google Map Marker Not cenetered
I am trying to get the map to be centered to the defaultMarker. However, when the map finish loading the view was slightly above the default marker. I have to scroll down to the middle to see the defaultMarker.
Any idea how I can center the view…
Pak Chu
- 253
- 1
- 5
- 13
0
votes
1 answer
Google Maps Working locally but not on Heroku
I deployed a react app to heroku but the map is not showing. I get these error messages:
Google Maps API warning: NoApiKeys https://developers.google.com/maps/documentation/javascript/error-messages#no-api-keys util.js:248:12
When I tried including…
Fatah
- 2,184
- 4
- 18
- 39