Get the real size of a SVG/G element

Question

Is there any accurate way to get the real size of a svg element that includes stroke, filters or other elements contributing to the element\'s real size from within Javascri

Answer 1

You can't get the values directly. However, you can get the dimensions of the bounding rectangle:

var el   = document.getElementById("yourElement"); // or other selector like querySelector()
var rect = el.getBoundingClientRect(); // get the bounding rectangle

console.log( rect.width );
console.log( rect.height);

It is supported at least in the actual versions of all major browser.

Check fiddle