Questions tagged [react-google-maps-api]
93 questions
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
onMouseOver and onMouseOut triggers every mapped element
With react google maps api I am trying to do open info window when user mouse over a marker. When I hover single marker every info window opens.
`
const [showMarker, setShowMarker] = useState(true);
return isLoaded ? (

gro0wy
- 11
- 1
1
vote
0 answers
@react-google-maps/api with custom overlay unclickable
I am building a react google map to render property listings and everything is visually fine
My CustomOverlay component is made to replace default markers and renders accordingly, but doesn't enable clicking on the div even though the function…

Paul Wilson
- 562
- 5
- 16
1
vote
0 answers
Rotate the google map polyline around the certain point
I am working with a 3D model using Autodesk Forge extension Geolocation and displaying it on Google Map (@react-google-maps/api). I have the coordinates of a polygon in 3D world coordinates and a polyline in latitude and longitude coordinates. I…

norbekoff
- 1,719
- 1
- 10
- 21
1
vote
1 answer
How to display StreetViewPanorama in React?
Im wondering if it is even possible. Found some libraries on the internet but their docs are poorly described or outdated. Im trying to have fully working streetview using google API key
I was trying using @react-google-maps/api library with docs at…

Jakub Falkiewicz
- 13
- 3
1
vote
0 answers
How to simulate click on custom geojson layer with @react-google-maps/api?
I currently have a map loaded with my custom geojson. The geojson layer is attached with a z-index of 1 and an onclick function that reads the feature from the geojson data. Since the z-index is higher than the map, the onclick function attached to…

ILoveET
- 109
- 1
- 6
1
vote
0 answers
Unable to show polyline in Google Maps Directions using react-google-maps-api
I am trying to show directions on google map. I am getting correct directions data but direction renderer only showing origin and destination markers but polyline or precisely route is missing between them. I am using react google maps api…

Ahmad Hassan
- 19
- 3
1
vote
0 answers
How do I make a dynamic "Get Directions" button component using google maps
I'm creating a "Get Direction" button component.
interface PropsType {
coordinates: {
lat: number;
lng: number;
} | null;
}
type LocationAdress = {
city: string
name: string
state: string
address: string | null
}
export…

Peter Villaroman
- 9
- 3
1
vote
2 answers
@react-google-maps/api Google maps Marker not showing react JS
Anyone can help?
My map is being rendered and working perfectly but my marker is not working I have been fighting with this for 4 hours.
import React from "react";
import { GoogleMap, Marker } from "@react-google-maps/api";
function…

Hassan Farooqstar
- 13
- 6
1
vote
1 answer
React google map api integrating inforWindow on click of marker
I am using the react-google-maps/api library. I have an array with 8 locations and I am displaying different custom svg markers on all those locations. Till here all works great. Now I am stuck with the implementation of infoWindow on click of each…

SuRaj Creator
- 945
- 1
- 9
- 25
1
vote
1 answer
Heatmap Layer not displaying in Google Maps API (@react-google-maps/api)
I'm trying to get a Heatmap layer to show within google maps inside my React application. When I npm start I get the following application:
However, there is no visible Heatmap layer even though I provided the HeatmapLayer as a child component to…

EsotericLanguage
- 87
- 2
- 12
1
vote
0 answers
react-google-maps api onRightclick event not working on Macbook touchpad
I just started using React Google Maps API https://react-google-maps-api-docs.netlify.app/#marker, and I noticed that the onRightClick props or event is not fired when using Macbook trackpad on browsers that use Webkit specifically (Chrome, Opera,…

Oluwagbemi Kadri
- 400
- 5
- 15
1
vote
1 answer
SVG generation using ST_AsSVG - Transform (EPSG: 4326) to (EPSG: 3857)
I have a Django model which contains the coordinates for a polygon:
geometria = models.PolygonField(srid=4326, null=True, geography=True)
I manually took the lat-long coordinates for a polygon from the Google maps web interface and entered them…

Stephen
- 53
- 1
- 6
0
votes
0 answers
HeatMApLayer is not conditionally rendering in react js (Using @react-google-maps/api)
I am not able to hidethe heatmap on zoom it's working fine in case of markers but not in heatMapLayer
it doesn't change when i am zooming in the state is changing but the HeatMApLayer component doesn't change
i am changing a state on…

Tushar Thakur
- 1
- 2
0
votes
0 answers
@react-google-map/api: auto adjust marker popup pos if near map container edge
I try to find a way to adjust markers popup window position based on following condition: if popup is near map containers edge.
Reason: right now popup is being hidden under container if marker (and popup, ofc) is near edge.
Working example: I am…

mortvicious
- 89
- 8