仅从缩放或仅从平移功能中排除 SVG 元素答案

【问题标题】：exclude SVG element only from zoom or only from pan functionality仅从缩放或仅从平移功能中排除 SVG 元素
【发布时间】：2017-08-25 06:05:45
【问题描述】：

我想知道是否可以仅从缩放（缩放）功能中排除 SVG 元素（如圆圈）并保留他的平移。例如：在地图中，我用红色实心圆圈指向我当前的位置。当用户缩放时，我希望这个圆有一个恒定的半径。当用户平移时 - 我希望圆圈与所有其他视口内容一起平移。我找到了这个解决方案：

但我似乎无法弄清楚如何正确使用 svg-pan-zoom 库。

我也想知道类似的任务 - 是否可以拖放一些元素？仅意味着要从平移功能中排除的元素？我尝试了一些方法，比如 jQuery draggable，但没有运气。

谢谢

【问题讨论】：

【解决方案1】：

几周后，我有了某种解决方法。我使用 ariutta/svg-pan-zoom 库的 onZoom 事件处理程序并编写了一个像这样的简单函数：

 onZoom=function(currZoom){
  document.getElementById("marker").setAttribute("r", 2/currZoom);
}

就我而言，我有一个代表当前位置的小圆圈。现在，当用户缩放时，库将当前缩放级别作为参数传递，我们将他划分为半径，然后我们就走了！

我还找到了解决其他问题的方法。如果我们在所需元素的相应鼠标事件中使用 enablePan / disablePan 则可以拖放。我现在不能发布代码示例，因为我仍然无法阐明如何计算精确的 dX/dY 以匹配当前缩放级别，但这绝对有效。

【讨论】：