Jump to content
Search Community

SVG appendChild at specific childNode

SJH test
Moderator Tag

Go to solution Solved by PointC,

Recommended Posts

I am able to move a grouped element within my SVG to the front of all other elements using appendChild, but how do I put it back into the same Z level that I took it from?

 

Before the appendChild code runs the Firebase group is on the bottom of the SVG stack; after the code runs it is on the top. How do I put it back to its original bottom position.

 

See the Pen KKxQLOE by sandalwoodsh (@sandalwoodsh) on CodePen

Link to comment
Share on other sites

See the Pen eYLMYLd by sandalwoodsh (@sandalwoodsh) on CodePen

 

The solution I opted for was to clone the object and append the clone to the SVG; that way the original remains intact. Since I only want to bring the group <g> to the front, it works for my purposes. Once I'm done with the clone, I can remove it and the original element still exists in its proper layer within the SVG stack.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...