使用JS将SVG元素附加到现有SVG元素

Question

我正在尝试将SVG元素圈附加到现有的SVG元素上，我想绕圈坐在地图顶部（即叠加层），但我无法正确执行此操作，为此我创建了JSfiddle。请让我知道如何实现此目标。

我的代码在这里

我如何使用下面的代码在精确的坐标处附加

document.getElementById('us').appendChild(c1);

Answer 1

您应该从html中删除onmouseover属性，并在javascript代码中绑定mouseover事件，类似于以下伪代码：

var item = document.getElementById('id');
item.addEventListener('mouseover', function() {
    var x = getXPosition();
    var y = getYPosition();
    circleElement.setAttribute('cx', x);
    circleElement.setAttribute('cy', y);
}, false);

您还应该在需要时使用CSS类，内联样式或任何其他方法来显示/隐藏元素。