Question

当我附加两个圆圈时，我没有任何结果。以下是我的代码。添加到组中的第一个创建的圆圈是可以的。但是附加在已经创建的圆圈中的下一个小圆圈没有显示。我不知道出了什么问题。我可以欣赏任何建议。抱歉我的英文。

function drawCirc(x, y, r, id) {

var circ = document.createElementNS(svgURI, 'circle');
circ.setAttributeNS(null, 'cx', x);
circ.setAttributeNS(null, 'cy', y);
circ.setAttributeNS(null, 'r', r);
circ.setAttributeNS(null, 'fill', '#CCFFCC');
circ.setAttributeNS(null, 'stroke', '#6BC1C8');
circ.setAttributeNS(null, 'stroke-width', '5');
circ.setAttribute('id', id);

// to add small circle
var circStart = document.createElementNS(svgURI, 'circle');
circStart.setAttributeNS(null, 'cx', (x-5));
circStart.setAttributeNS(null, 'cy', (y-10));
circStart.setAttributeNS(null, 'r', 8);
circStart.setAttributeNS(null, 'fill', 'blue');
circStart.setAttributeNS(null, 'stroke', '#E6F1DB');
circStart.setAttributeNS(null, 'stroke-width', '2');

document.getElementById(group).appendChild(circ);

document.getElementById(id).appendChild(circStart);}

Answer 1

您无法在SVG中嵌套圆圈（或任何其他形状）。您需要为容器创建所有子容器，例如<g>或<svg>元素。

在您的情况下，您可能希望将代码的最后一行更改为

document.getElementById(group).appendChild(circStart);}

追加孩子不能在两个圈子里工作

1 个答案: