title: legend placement issue in D3 Bar chart
body: <p>I have a stacked bar chart. I want to place the legend, just above the chart area ends and in centre like this <img src="https://i.stack.imgur.com/yVa7E.png" alt="legend"></p>
  
  <p>I have created a Fiddle Here<a href="http://jsfiddle.net/9UfT2/6/" rel="nofollow noreferrer">Legend Fiddle</a></p>
  
  <p>But I am facing issue in locating the legend at correct position so that it works on IPAD as well.
  I know some issue in </p>
  
  <pre><code>.attr("transform", function(d, i) { return "translate(-180," + i * 20 + ")"; });
  </code></pre>
  
  <p>Could you please help in placing legend at right location.
  Thanks
  Gunjan</p>