javascript - 当我们在 react-google-maps 中点击圆圈时如何显示信息窗口

Question

<Circle 
 center={{ lat: LAT, lng: LNG }}>
     <InfoWindow>some text</InfoWindw>
</Circle>

圆圈正确显示在 map 上，但找不到信息窗口。

如果将 Circle 替换为 Marker，则可以正常工作。

Answer 1

看起来你在使用 react-google-maps

在 this way 中解决了这个问题，如果有人可以分享，我认为有更好的方法来解决它，我很感激。这是我的:

<Marker
  position={{ lat: LAT, lng: LNG }}
  visible={false}
  key={key}
>
  <InfoWindow
    onPositionChanged={() => console.log('on position changed')}
    onContentChanged={() => console.log('on content changed')}
  >
    <div>
      <span>Name:</span><br/>
      <Circle
        radius={radius}
        center={{ lat: LAT, lng: LNG }}
      />
    </div>
  </InfoWindow>
</Marker>