D3: get the bounding box of a selected element

Question

I have several elements in a svg and I want to zoom on one of them.

I'd like to do the same as this example but with non geo paths. Something like

d3.select(myElement).bounds() that I can use to pan and zoom my svg

I did not find anything with D3. did I miss something?

Thanks

Answer 1

The Answer to the original question, and the implied general point is that yes, D3 has a function to access the underlying DOM node, and that no, it doesnt bother to override those functions where not necessary:

d3 has a function ".node()" which returns the the underlying DOM node of the first item in the d3 selection:

d3.select("#usefulSelector").node().getBBox();

for you specifically:

d3.select(myElement).node().getBBox()

docs: https://github.com/mbostock/d3/wiki/Selections#node