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

Question

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

Scale independent elements

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

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

谢谢

Answer 1

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

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

在我的情况下，我有一个代表当前位置的小圆圈。现在，当用户缩放时，库将当前缩放级别作为参数传递，我们将他分成半径并关闭我们去！

我也找到了解决另一个问题的方法。如果我们在所需元素的相应鼠标事件中使用enablePan / disablePan，则可以拖放。我现在无法发布代码示例，因为我仍然无法澄清如何计算与当前缩放级别匹配的精确dX / dY，但这肯定有效。