title: Rotating text paths in d3.js chord diagram without usual svg:text
body: <p>I am trying to adapt this Chord diagram by Mike Bostock:</p>
  
  <p>I want to have the text labels rotating outwards like this chord diagram:</p>
  
  <p><a href="http://bost.ocks.org/mike/uberdata/" rel="nofollow noreferrer">http://bost.ocks.org/mike/uberdata/</a></p>
  
  <p><img src="https://i.stack.imgur.com/fCd3D.png" alt="enter image description here"></p>
  
  <p>There is an example here </p>
  
  <p><a href="http://bl.ocks.org/mbostock/910126" rel="nofollow noreferrer">http://bl.ocks.org/mbostock/910126</a></p>
  
  <p><img src="https://i.stack.imgur.com/LA58d.png" alt="enter image description here"></p>
  
  <p>However, the transformation is done using the svg:text :</p>
  
  <pre><code>  g.append("svg:text")
        .each(function(d) { d.angle = (d.startAngle + d.endAngle) / 2; })
        .attr("dy", ".35em")
        .attr("text-anchor", function(d) { return d.angle &gt; Math.PI ? "end" : null; })
        .attr("transform", function(d) {
          return "rotate(" + (d.angle * 180 / Math.PI - 90) + ")"
              + "translate(" + (r0 + 26) + ")"
              + (d.angle &gt; Math.PI ? "rotate(180)" : "");
        })
        .text(function(d) { return nameByIndex[d.index]; });
  </code></pre>
  
  <p>The one I am trying to adapt uses "text" and "textPath" and I don't seem to be able to simply add a transform/rotate attribute. Adding this line </p>
  
  <pre><code>.attr("transform",function(d,i){return "rotate(90)";})
  </code></pre>
  
  <p>to the code below does nothing:</p>
  
  <pre><code>   // Add a text label.
          var groupText = group.append("text")
              .attr("x", 6)
              .attr("dy", 15);
  
              groupText.append("textPath")
              .attr("xlink:href",  function(d, i) { return "#group" + i; })
  
             .text(function(d, i) { return cities[i].country; });
  </code></pre>
  
  <p>Any ideas how I can rotate the text outwards so smaller chord groups text labels can be displayed without being bunched up or (as is the orginal solution) turned off altogether?</p>