javascript - Dynamically Created `circle` not visible -


i have following code. can see newly created circle inspect element. not visible on page.

function drawcircle(x, y, r) {      var circle = document.createelementns(null, 'circle');      circle.setattributens(null, 'cx', x);      circle.setattributens(null, 'cy', y);      circle.setattributens(null, 'r', r);      circle.setattributens(null, 'fill', 'red');      circle.setattributens(null, 'stroke', 'black');      circle.setattributens(null, 'stroke-width', '2');      document.getelementbyid("group").appendchild(circle);  }  drawcircle("50", "50", "30");
<svg id ="group" height="100" width="100"></svg>

svg elements must created in svg namespace. i.e.

function drawcircle(x, y, r) {      var circle = document.createelementns('http://www.w3.org/2000/svg', 'circle');      circle.setattributens(null, 'cx', x);      circle.setattributens(null, 'cy', y);      circle.setattributens(null, 'r', r);      circle.setattributens(null, 'fill', 'red');      circle.setattributens(null, 'stroke', 'black');      circle.setattributens(null, 'stroke-width', '2');      document.getelementbyid("group").appendchild(circle);  }  drawcircle("50", "50", "30");
<svg id ="group" height="100" width="100"></svg>


Comments

Popular posts from this blog

html - Outlook 2010 Anchor (url/address/link) -

javascript - Why does running this loop 9 times take 100x longer than running it 8 times? -

Getting gateway time-out Rails app with Nginx + Puma running on Digital Ocean -