reactjs - 以位置为中心渲染谷歌地图 OverlayView

Question

我需要渲染一个以特定位置为中心的按钮，现在我正在使用 OverlayView 来渲染按钮。

    <OverlayView
      position={north}
      mapPaneName={OverlayView.OVERLAY_MOUSE_TARGET}
    >
      <MapContextButton
        onClick={e => {
          e.preventDefault();
          console.log('click');
        }}
      />
    </OverlayView>

它产生以下结果，在北点上渲染叠加层的左上角位置。有没有办法让它以位置为中心渲染？

标签： reactjsgoogle-mapsgoogle-maps-markersreact-google-maps

Answer 1

我能够通过使用标记为图标设置锚位置来解决这个问题

          <Marker
            position={north}
            icon={{
              url: MapContextIcon,
              anchor: new window.google.maps.Point(16, 16),
            }}
            onClick={() => {
              setIsPopoverOpen(!isPopoverOpen);
            }}
          />