Questions tagged [react-google-maps]

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.

462 questions
1
vote
1 answer

How to draw a dotted Polygon and Circle using "@react-google-maps/api"?

I am using @react-google-maps/api": "1.8.2" and wanted to draw a dotted polygon and circleBut when I pass options ({icons: [icon: lineSymbol, repeat: '10px]}) to the or . its not working. const lineSymbol = { path: 'M 0,-1 0,1', scale: 2, …
Hemanth
  • 139
  • 1
  • 7
1
vote
1 answer

How to get the latitude and longitude value when the user marks a point on the map?

I'm still a beginner in React, and I'm doing a test project where the user marks a point on the map. The problem is that I am not able to save the value of the latitude and longitude variables. I need the value of these variables to send in a form…
vbernal
  • 673
  • 8
  • 21
1
vote
1 answer

react-google-maps hooks and getBound()

I'm building an application that update the markers each time the user move the map. I'm using the method onBoundChanges to get the bounds and store them in a hooks (setBounds(mapBounds).) Unfortunately when I try to store it in a hook with…
Derka
  • 11
  • 3
1
vote
1 answer

How to change the default Marker used in the Google Maps API Drawing Layer controls

I would like to know how could I use a custom marker with google maps drawing controls. I want to do that because I need to place a marker when a user clicks in the map and have it open a info window (when clicked) and have a few custom actions in…
1
vote
1 answer

CORS error working with @react-google-maps/api

I'm running into a CORS error with the onClick function setting. I'm just setting up static markers (markers there on page load and not dynamically added). I've got them rendering fine but when I actually click the markers I get a CORS error that…
1
vote
1 answer

react-google-maps "google is not defined"

I'm using the react-google-maps in one of my react projects. But I'm getting this error: google is not defined I've tried several other solutions from stack-overflow but none worked for me. Here's my code: /* global google */ import React, {…
Arfizur Rahman
  • 384
  • 4
  • 13
1
vote
1 answer

Can I set a 'default center' value in react-googe-maps/api?

I was using the original react-google-maps package for a while but realized it hadn't been updated for a a couple years so i installed an updated package called react-google-maps/api. Both packages have a component called but the old…
AndoKay
  • 57
  • 2
  • 9
1
vote
0 answers

Get details of all the Markers covered under a drawn polygon or any shape using react-google-maps

I am using react-google-maps. I have created map and displayed 3 types of markers in it. I can now draw polygons on map but not able to get the details of markers covered under the drawn shape. Any help would be appreciated. This is my code of map…
1
vote
0 answers

Can't get new coordinates from react-google-maps Polygon onDragEnd event

I want to get new coordinates from onDragEnd of Polygon component of react-google-map class CustomMap extends React.Component { handlePolygonDrag = (e) => { console.log(e); // event does not have a polygon object …
1
vote
1 answer

How to fetch coordinates of Polygon in React.JS using react-google-maps

I wants to fetch all the coordinates of a polygon drawn on Google's Map. And here is my code import React from "react"; import { compose, withProps } from "recompose"; import { withScriptjs, withGoogleMap, GoogleMap, Marker } from…
1
vote
1 answer

"Google Maps JavaScript API multiple times" error when using react-google-maps with react-places-autocomplete

I am using react-google-maps which requires a googleMapURL prop on it's component (which declares Google Maps JavaScript API) and react-places-autocomplete which requires a script with google maps js API too. When I do both, I get the error "You…
1
vote
2 answers

Updating markers without reloading the whole map

import React from 'react'; import {GoogleMap, withScriptjs, withGoogleMap, Marker} from 'react-google-maps'; import {db} from './Firebase'; import {useState, useEffect} from 'react'; import InfoWindow from…
KevinKipkemei
  • 43
  • 1
  • 8
1
vote
2 answers

How to create and set a setMapTypeId using react-google-maps

I was looking for a way to create my own mars map in a website, using google maps. I found this example in google map api function initMap() { var map = new google.maps.Map(document.getElementById('map'), { center: {lat: 0, lng: 0}, …
dobleUber
  • 566
  • 6
  • 22
1
vote
1 answer

How to get formatted_address out of two different SearchBoxes with react-google-maps?

I want to get the formatted_data out of two different SearchBoxes in the same GoogleMap in React. I am using the react-google-maps library. I have no clue how to go about it and I haven't found any information about it on the entire internet. I…
1
vote
1 answer

How do I access a Map object using React Google Maps API?

I am trying to access the getBounds method of a Google Map installed in my Web application using the new @react-google-maps/api library, which is a replacement for the unsupported react-google-maps library by tomchentw. Unlike the old…