动态创建的 svg 元素上鼠标滚动时的 ZoomIn/ZoomOut答案

【问题标题】：ZoomIn/ZoomOut on mouse scroll on dynamically created svg elements动态创建的 svg 元素上鼠标滚动时的 ZoomIn/ZoomOut
【发布时间】：2014-11-17 10:50:19
【问题描述】：

我有一个应用程序 i asp.net i，我有一个视图页面，其中动态创建了我的 svg 元素。现在我想将缩放功能应用于所有已创建的 svg 元素。滚轮向上滚动应该放大，向下滚动应该缩小

 <svg id="SomeSVG" viewBox="0 0 1800 1800">

 <g id="@someId" class="group" data-name="@lSomeName">
 <polygon points="@SomePoints" class="polygon" /> 
 </g>

 <svg>

在 svg 之后有一个 for 循环，从那里它从模型中获取数据并创建了一个多边形集群。创建的每个组的 id 都是唯一的。

【问题讨论】：

标签： javascript jquery asp.net asp.net-mvc-4 svg

【解决方案1】：

我找到了一个 jquery 插件，可以很好地满足我的需求

https://github.com/ariutta/svg-pan-zoom

只需按照链接上给出的步骤进行操作

如果您有多个组，则无需将类保留为视口。因为如果你这样做，它只适用于创建的第一个元素，如果你删除它，那么它将适用于整个 svg

【讨论】：