CODEWITHSUNDEEP
snap.svg
Vadim Loboda
Vadim Loboda

Reputation: 3101

Wrap SVG-DOM element with Snap.svg

Snap.svg allows to create a Snap-object from SVG-DOM element by CSS selectors. For example, how to get a Snap-object myLine wrapping SVG-DOM line by its id:

var paper = Snap('#my-svg');
var myLine = paper.select('#my-line');

That's OK.

But what if our SVG-DOM element does not have any ID?

How to create a Snap-object from SVG-DOM element having that element itself?

// here I use an ID just to get a variable with the pointer to SVG-DOM element
var svg_dom_element = document.getElementById('my-line'); 

var paper = Snap('#my-svg');
var myLine = paper.select(svg_dom_element); // this line of code throws an error

What the third line of code should be here?

One of the workaround is to assing a random ID to the element and then use paper.select to get a Snap-object. But that is not cool. :)

Upvotes: 0

Views: 521

Answers (1)

Ian
Ian

Reputation: 13842

You don't need to select it, 'select' will take a css selector, which a DOM element isn't.

All you need to do, is pass Snap the DOM element, so it's even easier :).

var myLine = Snap(svg_dom_element);

Upvotes: 2

Related Questions