title: draw text in d3 arc javascript
body: <p>I have created an arc with d3 on <a href="http://jsfiddle.net/PRb93/1/" rel="noreferrer">http://jsfiddle.net/PRb93/1/</a></p>
  
  <pre><code>var vis = d3.select("body").append("svg")
  var pi = Math.PI;
  
  var arc = d3.svg.arc()
      .innerRadius(300)
      .outerRadius(320)
      .startAngle(0 * (pi/180))
      .endAngle(-pi)
  
  vis.append("path")
      .attr("d", arc)
      .attr("transform", "translate(350,350)")​
  </code></pre>
  
  <p>Now I want to draw texts on top of this arc (I'll distribute this arc into <code>n</code> nodes). I cannot use chord layout directly because I don't have a square matrix. My table is rectangular and there is one lhs and more than one rhs. So I'll take one small hemisphere for one rhs and one big hemisphere for lhs.</p>
  
  <p>also I am puzzled how to draw the connections between two nodes here. not getting any clue</p>
  
  <p>I want to achieve something like <a href="http://bost.ocks.org/mike/uberdata/" rel="noreferrer">http://bost.ocks.org/mike/uberdata/</a> :</p>
  
  <p><img src="https://i.stack.imgur.com/XN5Ce.jpg" alt="enter image description here"></p>