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
1
vote
0 answers
How to remove poi when using ImageMapType's getTileUrl method?
I am trying to remove the poi when Modifying the Map Type Registry. The issue I am having is that when I use ImageMapType's getTileUrl method, the styles I add to options dissapear. Please take a look at this sample:
map.setOptions({
…
Juan David Arce
- 814
- 8
- 14
1
vote
1 answer
react-google-maps Content Security Policy
I am integrating react-google-maps in nextjs. Every thing works fine but when map is opened the images are not loaded:
I get Refused to load image because it violates the following content security policy directive : "img-src *"
What does this mean…
Piyush arora
- 37
- 3
1
vote
1 answer
How can I get the current map center coordinates using getCenter in @react-google-maps/api?
I am working with GoogleMap component from @react-google-maps/api, but can't seem to find how can I get the currently centered map coordinates (lat & lng) after I have moved it?
By searching around I found this article, which asks a similar…
Smlok
- 598
- 6
- 19
1
vote
1 answer
DirectionsRenderer and DirectionsService @react-google-maps/api not getting rendered and also not throwing error
I am trying to user Direction service of @react-google-maps/api.
I am using reactjs and doc link is https://react-google-maps-api-docs.netlify.app/#directionsservice.
{response !== null && (
Monish N
- 330
- 1
- 6
- 15
1
vote
2 answers
Cannot access this.searchBox from StandaloneSearchBox in react-google-maps/api
I am trying to access the getPlaces() function which should be in the StandaloneSearchBox component from react-google-maps/api. In the documentation and other examples the are using it this way:
function Map() {
// does not work.
// Error ->…
Michal Ružička Ružička
- 1,045
- 8
- 25
1
vote
2 answers
react-google-maps resets map when using onClick events
I'm having difficulty implementing some simple react-google-maps code where whenever a marker is clicked or an info box is closed, the map will reset its position to the original position. I saw that I should be rendering the map component…
Forrest Daggett
- 21
- 4
1
vote
1 answer
React Google Map and React Places Auto Complete: You have included the Google Maps JavaScript API multiple times on this page
I need to include the google map API twice for my 2 components. Because of that, this error occurs You have included the Google Maps JavaScript API multiple times on this page. I can't remove the first google map API link inside index.html because I…
rjc30
- 227
- 4
- 14
1
vote
1 answer
react-google-maps change marker icon to waypoints
I am developing tracking web view of delivery app using react-google-maps (https://tomchentw.github.io/react-google-maps/). I need to customize the icon of the waypoints marker. I already search in google and integrate to my codes but unfortunately…
Charmanne Galicia
- 11
- 2
1
vote
0 answers
React js map MarkerClusterer change color and written inside
I am using the following module map for maps in reactjs.
But I have to change the color of the MarkerClusterer and the writing inside it.
At the moment, the writing inside it tells me how many
Paul
- 3,644
- 9
- 47
- 113
1
vote
1 answer
Need dynamic icon for MarkerClusterer in @react-google-maps/api
TL;DR: In @react-google-maps/api, I want to be able to make dynamic cluster icons/symbol in the style of pie charts, based on the markers in the cluster, but it seems I can only make icons from a static array, and cannot pass the the markers as…
Micniks
- 61
- 6
1
vote
1 answer
adding useMemo or useCallbacks to the map component breaks the code with error "Rendered more hooks than during the previous render "
what im trying to do
place a marker on the map and calculate the distance between the marker and a static location on the map.
problem description
previously my useEffect was causing re renders ,now when i try to cache the functions i get this…
Mohamed Sauood
- 75
- 1
- 9
1
vote
1 answer
google-map-react marker clustering issue
Hi I am making a react site which ideally should involve clustering of markers.
I have used two different techniques for this both effectively display onto the map and one even clusters but I am hoping that I can combine these techniques.
The reason…
WebDevSo
- 47
- 1
- 7
1
vote
0 answers
How to pass component as icon for google.maps.MarkerImage?
Below is my custom google marker icon
let airportMarker = new google.maps.MarkerImage(
"../images/airport_pin.png",
null, /* size is determined at runtime */
null, /* origin is 0,0 */
null, /* anchor is bottom…
Praveen Dass
- 586
- 1
- 3
- 13
1
vote
1 answer
How to get address based on lat lang lng in react google map
I have a map rendered using react-google-map plugin. The flow is drag the marker and get the lat, lng and the address based on marker location. Im only getting the lat and lng. How can I get the address?
Here is my code below.
import React from…
Alfon Labadan
- 45
- 2
- 8
1
vote
0 answers
Typescript and react-google-maps Element is not assignable to type 'never'
Hold on, I've found a solution!
The WrappedMap only needs to be typed as any.
I'm a beginner at TypeScript. I am currently working on "react-google-maps"
The error message (Element is not assignable to type 'never') comes with the four elements:…
Alligator
- 250
- 1
- 7
- 14