[SOLVED] SVG path does not show


I try to add SVG path to a element via JS file. It is added to HTML page, but does not show.

Screenshot from 2022-06-23 10-38-49
Screenshot from 2022-06-23 10-39-02
Screenshot from 2022-06-23 10-39-52

But if I go to Inspect menu to see SVG and:

  1. Copy svg’s external HTML
  2. Delete svg
  3. Paste svg
    Then it is show!

How to show it on normal work?

I don’t know the details but SVG is a special kind of XML document so you need to specify a namespace, so something like this should work:

const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');

No changes. Shows only after copy-paste in inspector.

I forgot to mention, all SVG parts must be created using the document.createElementNS('http://www.w3.org/2000/svg', ...
So also the path node:

const path = document.createElementNS('http://www.w3.org/2000/svg', 'path');

That really should work :slight_smile:.

1 Like

Wow! Thanks, it works now.

1 Like