title: What do the Raphael object attributes "x" and "y" mean?
body: <p>I expected this to be 100% a no-brainer, but as it turns out, I cannot figure out what the <em>x</em> and <em>y</em> attributes of an svg created and manipulated with Raphael.js mean. I assumed they were the coordinates of the top-left corner of the object in relation to the canvas, but now I'm not so sure.</p>
  
  <p>After creating a canvas (<code>var paper = new Raphael(container,width,height)</code>) and adding an image or rectangle to it, for example, if I retrieve the "x" and "y" attributes using the <code>attr</code> method (e.g. <code>object.attr("x")</code>), they're both at 0. However, if I rotate that object and then retrieve the values of x and y again, the values don't reflect the position of the top-left corner of my object in relation to the canvas anymore.</p>
  
  <p>Can someone please explain this to me?</p>