如何在React项目中基于google-map-react实现静态地图效果

以下属性均可直接配置在GoogleMapReact组件上，实现完全无多余交互的静态展示效果：

• draggable={false}：禁用鼠标拖拽、触摸拖动平移地图视角的能力
• zoomControls={false}：隐藏界面自带的缩放加减控件，避免用户点击触发视角变化
• scrollWheelZoom={false}：关闭鼠标滚轮滚动触发的地图缩放操作
• disableDoubleClickZoom={true}：禁用双击地图触发的自动缩放交互
• keyboard={false}：屏蔽键盘按键触发的地图平移、缩放操作
• gestureHandling='none'：从地图底层配置层面禁用所有移动端触摸手势（单指拖拽、双指捏合缩放等）

直接传入scrollEnabled={false}无法实现预期的静态效果。
google-map-react组件并未将这个原生Google Maps JS API的属性作为顶层暴露的可配置参数，直接传递该属性不会被组件解析识别，无法起到任何交互控制作用。如果需要实现禁用滚轮交互的目标，只需替换为组件自身支持的scrollWheelZoom={false}属性即可，二者最终控制的交互逻辑完全一致，只需适配组件本身的属性命名规范。

静态展示场景的完整配置参考：

<GoogleMapReact
  bootstrapURLKeys={{ key: 'key' }}
  defaultCenter={center}
  defaultZoom={zoom}
  // 关闭所有多余交互的静态配置
  draggable={false}
  zoomControls={false}
  scrollWheelZoom={false}
  disableDoubleClickZoom={true}
  keyboard={false}
  gestureHandling="none"
>
  <TacoMarker
    link={shop.id}
    lat={latitude}
    lng={longitude}
  />
</GoogleMapReact>

内容的提问来源于stack exchange，提问作者lautaro