如何限制SVG水平平移（仅缩放级别1时生效）

核心是通过自定义beforePan回调函数，根据当前缩放级别动态限制平移方向：

function beforePan(oldPan, newPan) {
  // 获取当前缩放级别
  const currentZoom = window.panZoom.getZoom();
  
  // 缩放级别为1时，禁止左右平移（锁定x轴），保留上下平移权限
  if (currentZoom === 1) {
    return {
      x: oldPan.x,
      y: newPan.y
    };
  }
  
  // 缩放级别大于1时，允许全方向平移
  return newPan;
}

// 初始化svgPanZoom（保持原有配置，beforePan使用上面的函数）
window.panZoom = svgPanZoom('#limit-svg', {
  zoomEnabled: true,
  controlIconsEnabled: true,
  minZoom: 1,
  maxZoom: 10,
  beforePan: beforePan
});

逻辑说明 #

• 当缩放级别严格等于1时，强制让新的x轴平移位置和旧位置一致，彻底锁死左右移动；y轴则保留计算后的新位置，允许上下滑动查看SVG的垂直内容。
• 一旦缩放级别超过1，直接返回新的平移坐标，恢复全方向的平移权限。

内容的提问来源于stack exchange，提问作者Gustavo De Cinque Caléfi