getBBox() doesn't work on <use> elements.

[shshaw]

Snap.svg's getBBox() refuses to work on use elements. However, if you call getBBox() on the element's node, it does work, at least in Chrome. Firefox does get the correct values if you try background.node.getBBox() in the Console after loading.

See the example here: http://codepen.io/shshaw/pen/JoWGBB

<svg class="mySvg" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 370 185">
  <defs>
    <circle id="circle" cx="50%" cy="100%" r="63%" />
  </defs>
  <use class="background" xlink:href="#circle" />
</svg>

var mySvg = new Snap('.mySvg');
var background = mySvg.select('.background'); // The use reference

var firstResults = background.getBBox(); // Empty values
var secondResults = background.node.getBBox(); // The expected values

[ambervdberg]

I see this is an old thread, but I ran into this problem as well and found a solution.

You can temporarily add a group around the use element and get the bbox of that. This will return the correct values.

You can add a method to handle this to Snap. For example:

Snap.plugin(function (Snap, Element, Paper, glob) {
            Element.prototype.getBBoxUse = function () {
                var bbox = this.getBBox();
                if (bbox.cx === 0 && this.type === 'use') {
                    var g = Snap.parse('<g></g>').select('g');
                    g.insertBefore(this);
                    g.add(this);
                    bbox = g.getBBox();
                    this.insertBefore(g);
                    g.remove();
                }
                return bbox;
            };
 });

Now you can call background.getBBoxUse() to get the correct values.