我遇到了一个问题，我的 Zoom+ 按钮确实会缩放元素，但它们会随着元素的增长而重叠。
这是链接：http: //jsfiddle.net/knottAverage/ArKDp/28/
这是我用于缩放的功能+
$maxIcon.click(function(e) {
mapZoom /= mapMultiplier;
rsrGroupies.scale(mapZoom);
e.stopPropagation();
e.preventDefault();
rsr.setViewBox(0, 0, rsr.mapWidth, rsr.mapHeight);
});
预先感谢您的帮助。
大规模缩放集合正在做它应该做的事情 - 它正在缩放每个元素。相对于中心点翻译每个元素也需要额外的逻辑。
但我相信 viewbox 可以用来完成完全相同的效果。 您的小提琴的这种变体演示了如何调整画布的视图区域以响应缩放，并添加拖放以支持导航到缩放的场地地图的隐藏区域。可悲的是，它也被严重破坏了——事实上，它的功能足以指出一个可能的解决方案向量。我希望你会发现它有帮助而不是激怒！
最棘手的事情可能是缩放按钮（和任何其他导航组件）将需要平移和缩放以取消对可视区域的操作。否则，它们将与画布的其余部分一起缩放和移动！建议在第一个文件的顶部创建第二个文件（使用绝对定位和适当的 z-index）并将导航元素放在最顶层。
祝你好运。
在 SVG 容器顶部添加缩放按钮作为单独的 PNG 图像（通过 jQuery），使它们独立于 SVG，这样它们就不会随着 viewBox 的变化而放大（这就是我对 SVG 地图所做的）。