How to make Chrome redraw SVG dynamically added content?

Question

I\'ve dynamacally added the circle elements to the svg displayed in a iFrame. Chrome isnt showing the new elements, not tried FF yet. Is there somekind of redraw/refresh I n

Answer 1

I'm guessing, but have you tried createElementNS("http://www.w3.org/2000/svg","circle") instead of createElement("circle")?

Answer 2

I haven't tried what you are doing where you essentially have two sources but I do know Chrome doesn't need a refresh/redraw when dynamically adding content.

Here is my code maybe this will help you.

xmlns = "http://www.w3.org/2000/svg";
var C = document.createElementNS(xmlns,"circle");
C.setAttributeNS(null, "cx", cx);
C.setAttributeNS(null, "cy", cy);
C.setAttributeNS(null, "r", rad);
document.getElementById("background").appendChild(C);

Where background is just the id of a group (g tag)