title: Rotate a rectangle around a certain point in canvas
body: <p>Im trying to rotate a rectangle around the center of its parent rectangle. The child's distance to its parents borders must always stay the same. I almost succeeded but there seems to be a small error in my approach. I just can't seem to find the problem.</p>
  
  <p>Example :</p>
  
  <p><a href="http://jsfiddle.net/FJ789/3/" rel="nofollow">http://jsfiddle.net/FJ789/3/</a></p>
  
  <p>I'm using the following formule to rotate around the pivot point.</p>
  
  <pre><code>var rotateAroundPoint = function(point, pivotPoint, sin, cos)
  {
      position =
      {
          x : cos * (point.x - pivotPoint.x) - sin * (point.y - pivotPoint.y) + pivotPoint.x
      ,   y : sin * (point.x - pivotPoint.x) + cos * (point.y - pivotPoint.y) + pivotPoint.y
      };
  
      return position;
  }
  </code></pre>