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 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 to plot vertical base line to show current time using react-google-charts for chart type Timeline chart
//https://www.react-google-charts.com/examples/timeline
import { Chart } from "react-google-charts";
export function GoogleTimeLineChart(props){
const data…
sudheer kumar
- 11
- 2
1
vote
0 answers
react google maps render custom html on map
I'm using @react-google-maps/api ^2.12.1 in my react project. I want to create an interactive HTML component as a marker on the map. Still, on every documentation of google maps, I only find how to change a marker icon to set as a static icon image…
Felipe K. Bernardino
- 105
- 1
- 7
1
vote
1 answer
Next js - react-google-maps/api error when deploying in Vercel : A client-side exception has occurred
My next js app is working well in development and build but when I try to deploy it in Vercel I'm getting this error when I try to call the page calling my mapView component :
Application error: a client-side exception has occurred (see the browser…
sebastien pj
- 21
- 2
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
1 answer
How to add "outside" event listener to Markers in Google Maps (react-google-maps/api)
I have a list of hikes stored in state and I rendered the location of those hikes as Markers on the Google Map Component like so:
{hikes.map(hike =>
benwl
- 366
- 2
- 17
1
vote
0 answers
Want to open popover on react-google-map
I am trying to open a pop over when a google map shape is clicked
but i am unable to do that
I have tried this method which i am usually using to open a pop up when a button is clicked
But it is not working
Below is my code
{polygon !== null &&
…
deep shah
- 79
- 3
- 9
1
vote
0 answers
I want to open popover on react-google-map
I want to open a popover when a particular shape is clicked like this
This my code of what i have tried
content(poly)}
trigger="click"
className="crime-marker"
>
{" "}
…
deep shah
- 79
- 3
- 9
1
vote
0 answers
google map with search in react js
I'm using google-maps-react library for maps in my react application, and I'm adding search address functionality in my application and facing CORS error.
Error:
Autocomplete.js
import React, { Component } from 'react';
import styled from…
Zain Khan
- 1,644
- 5
- 31
- 67
1
vote
3 answers
Cannot read property of undefined (reading maps)
I wanted to take the distance between multiple points with Google's DinstanceMatrixService, and I get the following error:
I used google.maps... multiple times and it gave me the error about google being undefined. I searched on internet and found…
Alec
- 73
- 2
- 7
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
How to calculate the distance between differents lat long and display on map dynamically react native
I have implemented map in my application. Below is a dummy array geoCord[] I am getting api respons in one array and I am mapping this and diaplaying lar long on maps . No I am trying to calculate the distance between two lat longs, like in array…
Abhigyan Gaurav
- 1,854
- 6
- 28
- 58
1
vote
2 answers
Check if marker is visible on ViewPort google-maps-react
I am Currently working on a website like zillow.com, And I have to show data on the right side of map corresponding to the markers visible on map and whenever the user drags map I have to check for new markers on the map and show on the right…
Muhammad Hasnain
- 31
- 3
1
vote
1 answer
How to add custom buttons to react-google-maps?
I'm trying to add an in app map to my application. In this I need to add a button which will console log ("Hi I'm here") when clicked.
Package used here is "react-google-maps"
const handleOnLoad = GoogleMap => {
const controlButtonDiv =…
Vignesh
- 11
- 3