javascript - 有没有办法使用 google-map-react 从这个可拖动的标记中获取坐标？

Question

我已经制作了标记，因此它可以在地图上拖动。我正在尝试从标记中获取坐标，以便将它们保存到我的数据库中。下面是代码，是否有一个函数可以让我从拖动标记时获取坐标。或者我应该使用另一个谷歌地图反应库。

import React, {Component, useCallback} from "react";
import GoogleMapReact from "google-map-react";

class Map extends Component {
  loadMap = (map, maps) => {

    let marker = new maps.Marker({
      position: { lat: 40.856795, lng: -73.954298 },
      map,
      draggable: true,

    });
  };
  

  render() {
    return (
      <div style={{ height: "400px", width: "100%" }}>
        <GoogleMapReact
          bootstrapURLKeys={{ key: "key here" }}
          defaultCenter={{ lat: 40.756795, lng: -73.954298 }}
          defaultZoom={10}
          yesIWantToUseGoogleMapApiInternals
          onGoogleApiLoaded={({ map, maps }) => this.loadMap(map, maps)}

        >
        </GoogleMapReact>
      </div>
    );
  }
}

export default Map;

Answer 1

您正在使用 google api 作为标记，因此您可以使用markerdocs。

具体来说，您应该使用该dragend事件

就像是

handleDragEnd = (event) => {
  console.log(event.latLng);
}

loadMap = (map, maps) => {
  let marker = new maps.Marker({
    position: { lat: 40.856795, lng: -73.954298 },
    map,
    draggable: true,
  });
  marker.addListener('dragend', this.handleDragEnd);
};