無法創建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 
});