google-maps-react icon indicating copy to clipboard operation
google-maps-react copied to clipboard

onDragend and getting the new LatLng of the center of the map

Open matgargano opened this issue 5 years ago • 7 comments

I've a basic map...

<Map
        google={google}
        zoom={13}
        style={mapStyles}
        initialCenter={userCoordinates}
        onClick={this.onMapClick}
        styles={style}
        onDragend={this.centerMoved}
      />

thing to note is the onDragend property... I have it mapped to fire this.centerMoved... which is defined as such. I can't seem to figure out how to get the new map's Lat and Lng at this point...

centerMoved = (mapProps, map) => {
    console.log(mapProps.google.maps.LatLng()); // returns undefined
};

Is there any way to get this information? Am I using the wrong event?

matgargano avatar Jul 11 '19 03:07 matgargano

@matgargano did you ever figure this out? Running into the same thing

JamesLivengood avatar Nov 04 '19 04:11 JamesLivengood

I Don’t believe so.

On Nov 3, 2019, at 10:18 PM, James Livengood [email protected] wrote:

 @matgargano did you ever figure this out? Running into the same thing

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or unsubscribe.

matgargano avatar Nov 04 '19 11:11 matgargano

any solution for this ?

i found the solution : https://stackoverflow.com/a/51496164

fachrezamuslim avatar Nov 08 '19 03:11 fachrezamuslim

@matgargano your center moved function should be like this:

centerMoved = (mapProps, map) => {
    console.log('center: '+map.getCenter());
    console.log('center: '+map.center);
};

VicEsquivel avatar Feb 27 '20 22:02 VicEsquivel

centerMoved(mapProps, map) {
        console.log('args:', mapProps, map);
        console.log(map.getCenter().lat());
}

shivamjjha avatar Aug 09 '20 20:08 shivamjjha

I've had the exact same problem but I managed to get the new center values by using the following (it only showed up using the "toJSON"

onBoundsChange(mapProps, map) {
        this.setState({
            center: map.getCenter().toJSON()
        });
  }

gijsjager avatar Apr 30 '21 13:04 gijsjager

centerMoved(mapProps, map) {
        console.log('args:', mapProps, map);
        console.log(map.getCenter().lat());
}

this return undefined value sir. How can I do it?

khinnandartun avatar Aug 11 '21 07:08 khinnandartun