In the polyline tag, is there any attribute to overlap one area in the other?

Question

I made a code putting the attribute in the polyline and div tags, as in the div the "z-index" attribute works, I tested the same for polyline but it did not work.
https://code.sololearn.com/W5IBYYaeLX62/?ref=app

Answer 1

In SVG, the order the objects determines the objects appear in the document, cannot be overridden by z-index.

Rearrange the order or

append
<use xlink:href="#svg_area1" />
as the last svg object

https://code.sololearn.com/W36SpUC7udF2/?ref=app

Answer 2

For use xlink namespace you have to declare it... At example you can:

<svg xmlns="http://www.w3.org/2000/svg">
....... here you can use xlink
</svg>

Answer 3

z-index dont work with svg child elements in svg context.... Childs will be drawed in order (the last child is drawed on top)