Rectangle coordinates after transform

I am currently drawing a rectangle with a transformation on his parent element (g). The resulting svg is this;

<svg version="1.1" width="1055" height="381">
   <g transform="rotate(120)">
      <rect x="0" y="0" width="100" height="100" rx="10" ry="0" stroke-width="0" style="stroke:rgb(0,0,0)" id="rect-0"></rect>
      <rect x="100" y="0" width="100" height="100" rx="10" ry="0" stroke-width="0" style="stroke:rgb(0,0,0)" id="rect-1"></rect>
   </g>
</svg> 

Now I am trying to retrieve the coordinates of one of the rects dynamically, but using get开发者_运维技巧BBox does not return the correct result. Can anyone tell me how to get the correct x, y, width and height properties of one of the rects?

I found the solution myself;

var matrix = shape.getCTM();

// transform a point using the transformed matrix
var position = svg.createSVGPoint();
position.x = $(shape).attr("x");
position.y = $(shape).attr("y");
position = position.matrixTransform(matrix);