小编Pag*_*mag的帖子

使用react-google-maps从谷歌地图获取lat/lng

我有我的地图组件

\n\n
const MyMapComponent = withScriptjs(\n  withGoogleMap(props => (\n    <GoogleMap\n      defaultZoom={8}\n      defaultCenter={{ lat: props.lat, lng: props.lng }}\n      onClick={e => console.log(e)}\n    >\n      {props.isMarkerShown && (\n        <Marker position={{ lat: props.lat, lng: props.lng }} />\n      )}\n      <MarkerClusterer averageCenter enableRetinaIcons gridSize={60}>\n        {props.markers.map(marker => (\n          <CustomMarker\n            key={marker.id}\n            marker={marker}\n\n          />\n        ))}\n      </MarkerClusterer>\n    </GoogleMap>\n  ))\n);\nexport default MyMapComponent;\n
Run Code Online (Sandbox Code Playgroud)\n\n

我的应用程序组件返回此代码

\n\n
  return (\n      <div className="container">\n        <div className="map">\n// myMapComponent imported as Map\n          <Map\n            onMapClick={this.onMapClick}\n\n            googleMapURL="https://maps.googleapis.com/maps/api/js?v=3.exp&key=YOUR_API_KEY"\n            loadingElement={<div style={{ height: `100%` }} />}\n            containerElement={<div style={{ height: `95vh` }} />}\n            mapElement={<div style={{ …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs react-google-maps

4
推荐指数
1
解决办法
9859
查看次数

无法从react-google-maps/api中的StandaloneSearchBox访问this.searchBox

我正在尝试访问getPlaces()应该位于StandaloneSearchBox组件中的函数react-google-maps/api。在文档和其他示例中,我们以这种方式使用它:

\n
function Map() {\n\n // does not work.\n // Error -> \'this\' implicitly has type \'any\' because it does not have a type \n // annotation.ts(2683)\n // index.tsx(22, 10): An outer value of \'this\' is shadowed by this container.\n const onPlacesChanged = () => console.log(this.searchBox.getPlaces());\n\n  return (\n    <LoadScript\n      googleMapsApiKey="YOUR-API-KEY"\n      libraries={places}\n    >\n      <GoogleMap\n        mapContainerStyle={containerStyle}\n        center={center}\n        zoom={zoom}\n      >\n        { /* Child components, such as markers, info windows, etc. */}\n        <>\n          <StandaloneSearchBox onPlacesChanged={onPlacesChanged} >\n …
Run Code Online (Sandbox Code Playgroud)

javascript google-maps reactjs react-google-maps

1
推荐指数
1
解决办法
1973
查看次数