经纬志
首页 / OpenLayers / API 文档

DragPan

先看结论

拖动平移交互。鼠标按下拖动时移动地图中心,松开后按速度决定是否继续滑行。 地图默认就带这个交互,多数时候不需要手动创建。

最后验证 2026-11-03 · OpenLayers 10.3.1 · 更新 2026-10-29 · 引用本文
new ol.interaction.DragPan(options)

构造参数

参数默认说明
condition无修饰键时响应(mapBrowserEvent) => boolean,决定这一次拖动是否交给平移处理
kinetic启用默认惯性惯性参数对象,含 decay、minVelocity、delay

kinetic 的三个参数

参数说明
decay每帧速度衰减系数,越小停得越快
minVelocity低于该速度立即停止滑行,像素每毫秒
delay松手后延迟多久开始滑行,毫秒

示例:按住 Shift 时让出平移手势

var dragPan = new ol.interaction.DragPan({
  condition: function (event) {
    return event.originalEvent.shiftKey === false;
  },
  kinetic: {
    decay: 0.85,
    minVelocity: 0.1,
    delay: 50
  }
});

map.addInteraction(dragPan);

// 临时关闭平移,例如进入绘制模式
dragPan.setActive(false);

与其他交互抢手势

平移、框选、绘制都监听 pointerdown 与 pointermove。 地图按下时会把事件依次交给已注册的交互,先返回 true 的交互接管本次手势。 如果自定义交互没有设置 condition,平移会被完全挡住; 反过来,把 DragPan 的 condition 设成只在无修饰键时响应, 就能让 Shift 拖动专门留给框选。

移动端与触控

触摸屏上的单指拖动同样由 DragPan 处理,双指缩放由 PinchZoom 处理。两者同时激活时,手势判定按先到先得, 一般不需要额外配置。DragPan 关闭后单指拖动不再移动地图, 但滚轮与双击缩放仍然有效。

惯性会让定位测试变得不稳定。自动化测试里松手后地图还在滑行, 断言坐标会对不上。构造时传 kinetic: undefined 之外, 更直接的做法是在测试环境把该交互设为不活跃。

引用本文

经纬志(2026)。《DragPan》。https://www.jingweizhi.com/openlayers/api/drag-pan.html(访问日期 2026-11-03)。