小编Van*_*Van的帖子

如何使用react-google-maps通过点击在地图上添加标记?

我正在努力寻找一个非常简单的例子,说明当用户使用基于组件的React-google-maps点击地图时,如何向Google地图添加标记.需要帮忙.

const Map = withScriptjs(withGoogleMap((props) =>
  <GoogleMap
    defaultZoom={8}
    defaultCenter={{ lat: -34.397, lng: 150.644 }}
    onClick = {props.onMapClick}
   >
  {props.isMarkerShown && <Marker position={props.markerPosition} />}

 </GoogleMap>
))

export default class MapContainer extends React.Component {
  constructor (props) {
    super(props)
    this.state = {

   }
 }

render () {
  return (
  <div style={{height: '100%'}}>
    <Map
      googleMapURL="https://maps.googleapis.com/maps/api/js?key=AIzaSyC4R6AN7SmujjPUIGKdyao2Kqitzr1kiRg&v=3.exp&libraries=geometry,drawing,places"
      loadingElement={<div style={{ height: `100%` }} />}
      containerElement={<div style={{ height: `400px` }} />}
      mapElement={<div style={{ height: `100%` }} />}
      placeMarker={this.placeMarker}
    />
  </div>
)
 }
 }
Run Code Online (Sandbox Code Playgroud)

javascript google-maps google-maps-api-3 reactjs react-google-maps

5
推荐指数
2
解决办法
5104
查看次数