title: snapsvg - point of origin for scale/rotate after transform
body: <p>I'm currently failing to understand how the point of origin works when scaling and rotating.</p>
  <p>for instance, if I was to scale a 10x10 rectangle around its centre, I would expect I would have to get the rectangles last transform details (x and y), get the height and width of the rectangle and divide them by 2 and add them to the x and y but that just doesn't work.</p>
  <p>Using SnapSVG I use the Snap.Matrix() method to create the matrix based on the previous transform:</p>
  <pre><code>var data = activeElement.data('originalMatrix');
  var s = size/50; // size is a number from 1-100, defaulted to 50
  var matrix = new Snap.Matrix(1,0,0,1,data.dx,data.dy);
  matrix.rotate(data.rotate);
  matrix.scale(s,s);
  </code></pre>
  <p>I under stand that for both rotate and scale methods accept a point of origin but I cannot work out how to calculate these values. Anyone know?</p>