title: Calculating a percentage with mouse position considering half-circle
body: <p>I just tried to code some tricks on justGage (using Raphael JS code) to calculate percentages but I'm stuck on mathematical formula :( .</p>
  
  <p>Here's the point : 
  I have a div with 400px width that welcomes a svg justGage.
  I would like to make it filling following mouse clicking. For example, clicking on bottom right of the half-circle will fill it as if it was 100% filled. Clicking on bottom left, fill it at 0%.
  The issue is that I try to catch mouse position and use it to refresh the Gage, but working only on X axis is not following circle shape.</p>
  
  <p>Here's my basic calculation : </p>
  
  <pre><code>    var parentOffset = $(this).offset(); 
      var relX = e.pageX - parentOffset.left;
      g1.refresh(Math.round((relX)/4));
  </code></pre>
  
  <p>And the whole code test <a href="http://jsfiddle.net/LAB3k/" rel="nofollow">fiddle</a>.</p>
  
  <p>Does anyone know a formula to really follow the circle shape ?</p>