-1

It gets all the data correctly, shown in a console.log(), but when it is appended it does show up in devTools, but not on screen.

I also tried putting the data on the page by pasting what I got from console in it to see if there where any differences, there weren't, but the pasted code was shown on screen.

Anybody got a clue on how I can fix it?

EDIT: added the HTML and put the x and y values to what im getting from the before code, so its more clarified.

var element;
var i = 1;
var x = 799.8;
var y = 620;
element = document.createElement("circle");
element.id = "circle" + (i + 1);
element.setAttribute("cx", x);
element.setAttribute("cy", y);
element.setAttribute("r", "500");
element.setAttribute("fill", "#42b6f4")
document.getElementById("svghead").appendChild(element);

And here is the HTML:

<svg id="svghead" style="flex: 1 1 0%; height: 90%; margin-left: 3%; 
    width: 86.8%; border: 1px solid black;"></svg>
Daan T
  • 97
  • 1
  • 7
  • 2
    show ur html so we could help. And where is declaration of `element` – Maheer Ali Jan 28 '19 at 11:22
  • This seems to be in some SVG context …? Then you might(!) need to use the namespace-aware methods to create elements and set attributes, depending on what exactly you are doing there. https://stackoverflow.com/questions/3492322/javascript-createelement-and-svg – 04FS Jan 28 '19 at 11:24
  • element is defined above, simply by var element; – Daan T Jan 28 '19 at 11:25
  • @DaanT Where are those id's? ```document.getElementById("line" + i)``` – Mulli Jan 28 '19 at 11:35

1 Answers1

1

Remember you can't create svg elements by using simple createElement() you need to use createElementNS() which takes additional argument

let svgns = "http://www.w3.org/2000/svg";
var elm;
elm = document.createElementNS(svgns,"circle");
Maheer Ali
  • 35,834
  • 5
  • 42
  • 73