无法创建SVG线，但创建SVG圈工作正常

Question

我想在我的SVG中创建一个Cicle和一条线。但由于某种原因，我似乎无法创建/添加行到我的SVG。

这是我的代码：

findTop = wrapper.find("g[data-node-id='1']"); 
var obj = findTop.parent(); 
var newobj = obj.clone(); 

$(obj).append(document.createElementNS("http://www.w3.org/2000/svg", "circle")) 

$(obj) 
    .parent() 
    .find("circle") 
    .unwrap() 
    .attr("class", "get-btn trigger-btn") 
    .attr("data-btn-id", "1") 
    .attr("cx", "257.5") 
    .attr("cy", "100") 
    .attr("r", "20"); 

$(obj).append(document.createElementNS('http://www.w3.org/2000/svg', 'line')) 
    .attr({ 
    id: "line2", 
    x1: 0, 
    y1: 0, 
    x2: 300, 
    y2: 300 
    }); 

做任何人有一个想法，为什么我不能行添加到我的SVG？

Answer 1

该行实际存在。您需要为其添加笔划：

$(obj).append(document.createElementNS('http://www.w3.org/2000/svg', 'line')).attr({ 
    id: "line2", 
    x1: 0, 
    y1: 0, 
    x2: 300, 
    y2: 300, 
    stroke: "red", 
    "stroke-width": 2 
});