AGM Map手势处理异常：设置cooperative后仍无法禁用滚动缩放

针对你遇到的AGM Map设置gestureHandling='cooperative'后滚动缩放依然生效的问题，结合你提供的代码，我整理了几个可能的原因和排查方向：

1. CSS样式冲突干扰地图手势逻辑 #

从你的CSS代码来看，agm-map元素和父容器map-container都设置了overflow-y: scroll和overflow: hidden属性：

agm-map{
  height: 100vh;
  width: 100vw;
  margin-left: 0;
  padding: 0;
  -ms-overflow-x: hidden;
  overflow-x: hidden;
  overflow-y: scroll; /* 此属性可能干扰地图手势 */
  position: relative;
  overflow: hidden;
}

地图自身的手势事件处理依赖原生DOM事件传递，容器或地图元素的overflow配置可能会截断或干扰这些事件，导致gestureHandling的规则无法正常触发。建议先移除agm-map和map-container上的overflow相关样式，保留地图的height:100vh和width:100vw即可，让地图自己处理内部交互逻辑。

2. AGM版本或Google Maps API兼容性问题 #

部分旧版本的AGM组件可能对gestureHandling属性的支持不完善，或者需要搭配特定版本的Google Maps JS API使用。你可以：

• 检查@agm/core的版本，尝试升级到最新稳定版
• 确认导入AgmCoreModule时，配置的Google Maps API版本在v3.40及以上（该版本开始支持gestureHandling参数）

3. 属性绑定的语法细节问题 #

你当前使用的是属性绑定写法[gestureHandling]="'cooperative'"，虽然语法正确，但可以尝试换静态属性赋值的写法验证：

<agm-map [latitude]="lat" [longitude]="lng" [zoom]='12' gestureHandling="cooperative">

有时候属性绑定的字符串传递可能因框架绑定逻辑出现意外，静态赋值可以排除这种可能性。

4. 全局API配置覆盖组件局部设置 #

如果在AgmCoreModule.forRoot()的全局配置中设置了gestureHandling参数，会覆盖组件上的局部设置。比如：

AgmCoreModule.forRoot({
  apiKey: 'YOUR_API_KEY',
  gestureHandling: 'greedy' // 全局配置会覆盖组件的设置
})

检查你的模块配置，确保全局配置没有和组件的gestureHandling设置冲突，或者直接在全局配置中设置gestureHandling: 'cooperative'来统一生效。

5. 容器事件冒泡被阻止 #

父容器map-container的滚动事件如果被自定义逻辑阻止冒泡，会导致地图无法正确判断用户交互焦点，进而无法触发cooperative模式的规则。可以暂时移除容器上的overflow-y: scroll（地图已占满视口，容器无需滚动），测试手势是否正常工作。

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