0

I am accessing an existing DOM SVG element in my HTML using

svgEle = SVG.adopt(svgDocument.getElementById('svg'));

How can I access child elements of svgEle without adopting them individually? I have tried

 elementById = svgEle.select("#" + id);

and

elementById = svgEle.get(id);
cnbandicoot
  • 372
  • 3
  • 13
P.Ellis
  • 55
  • 2
  • 10

2 Answers2

1

In SVG.js 3.0+ the API changed and you should use .find() or .findOne() methods instead of .select().

See reference here: https://svgjs.dev/docs/3.0/referencing-creating-elements/#using-css-selectors

wout
  • 2,477
  • 2
  • 21
  • 32
Luca Faggianelli
  • 2,032
  • 20
  • 23
0

You use select(<CSS Selector>).

svgEle = SVG.adopt(document.getElementById('svg'))

svgEle.select("#keys")
    .stroke('yellow')

SVG.get(<ID>) only works for SVG elements created by SVG.js.

Here is jsfiddle to illustrate: https://jsfiddle.net/dotnetCarpenter/yy2opz8s/2/

dotnetCarpenter
  • 10,019
  • 6
  • 32
  • 54
  • Thank you, my problem when I had tried to use elementById = svgEle.select("#" + id); was that I had a '.' in the id which does not work. – P.Ellis May 25 '17 at 08:13
  • pleae note that `select` returns a `SVG.Set`. To get an element of the set you can use `first(), get(index), last()` – Fuzzyma May 31 '17 at 09:03