如何添加<a> link to svg path to navigate to another svg image using javascript</a>

Question

我是svg的新手。我有两个svg图像我需要在一个svg图像中的路径附加链接，点击该路径我应该导航到另一个svg图像。

<svg id="svg1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" >
    <g id="path1">
     <a xlink:href="" target="_top">
       <path id="parcel" />
     </a>
     </g>
 </svg>

我应该如何获取属性到我的应用程序（html）并使用javascript附加href链接到它。提前致谢

Answer 1

使用您选择的任何方法获取<a>元素的引用。例如

 <a id="mylink" xlink:href="" target="_top">
   <path id="parcel" />
 </a>

var  mylink = document.getElementById("mylink");

然后，您可以使用以下方式设置xlink:href属性：

mylink.setAttributeNS('http://www.w3.org/1999/xlink', 'xlink:href',
                      'http://www.google.com');