将velocity.js用于SVG动画,其中包含的图形为HTML对象标签



如何将velocity.js与svg图形一起使用,该图形包含在html对象标签中(这实际上是如何使用复杂的图形)。

基本上,包括图形:

<body>
  <div id="graph">
    <object id="objSvg" type="image/svg+xml
       data="./diagram-arch-server-SRS-CH.svg"></object>

然后,以下方法不起作用:

$("#server-webserver-4266").velocity({ x: "+=200", y: "25%" });
$("#objSvg").find("#server-webserver-4266").velocity({ fillGreen: 255, strokeWidth: 2 });

我正在使用jquery v3.1.1最新版本的velocity.js v1.4.3。我已经广泛搜索了一个解决方案,速度文档仅包括带有inline svg的示例(lake!)。

so,to pointy's Point(在上面的注释中),这里是使用JavaScript访问适当的SVG元素的 solution .js方法:

// refer to the HTML in the original post, then the following script works!
myObj = document.getElementById("objSvg");
myContent = myObj.contentDocument;
myServer = myContent.getElementById("server-webserver-4266");
$(myServer).velocity({ x: "150", y: "-=75" });
$(myServer).velocity({ fillGreen: 255, strokeWidth: 2 });

谢谢尖锐!

相关内容

最新更新