title: Finding the absolute position of the paper/canvas in the Raphael JavaScript library
body: <p>How can I find the absolute position of the paper/canvas when using the Raphael JavaScript library?</p>
  
  <p>For instance, suppose the minimal working example is as follows:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;script type="text/javascript" src="raphael.js"&gt;&lt;/script&gt;
  &lt;script&gt;
      window.onload = function() {
          var size = 600;
          var paper = new Raphael(document.getElementById("canvas_container"), 
                                  size, size);
          var c = paper.circle(100, 100, 50).attr({fill: "#00f"});
          var x = 0; // get the paper's absolute x coordinate
          var y = 0; // get the paper's absolute y coordinate
          document.getElementById("coordinates").innerHTML = x + " " + y;
      };
  &lt;/script&gt;
  &lt;style type="text/css"&gt;
      #canvas_container {
          width: 600px;
          margin-left: auto;
          margin-right: auto;
          border: 1px solid #aaa;
      }
  &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;p id="coordinates"&gt;&lt;/p&gt;
      &lt;div id="canvas_container"&gt;&lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>How do I find the absolute x and y coordinates of the paper from the top of the page without knowing the ID of the div that it lives in? (In the example, I can know that, but my actual situation makes knowing the div ID much more complicated.) </p>