javascript - d3.js を使用して円弧の視覚化に弦や曲線を追加することはできますか? (chord.groups を使用しない場合)

Question

約 74 個のパス要素を持つ半円であるアーク ビジュアライゼーションを作成しました。それぞれが国を表し、「arcValue」(各パスの高さとして表されます) です。

http://jsfiddle.net/developerAndADj/2DYrQ/

productCount > 0 を持つ国のコードをビジュアライゼーションに追加しようとしています。各コードは、対応する各パス要素から円弧の下にあるパスに移動します。

私は2つのことを達成しようとしています:

1. 製品数がある国とない国があることを示します。
2. これらの製品数を表す曲線または弦を使用します。

これまでのところ、半円の中心から各パス要素に向かう上記のフィドルの弧の内側に追加の弧を使用することができましたが、曲線効果はありません。

各国の製品数に基づいてコードを作成することもできましたが、コードを対応する国に合わせることができません。コードを生成するための私のコードは次のとおりです。

// Initialize the square matrix
var cDataMatrix = [];
for(var h = 0; h < data.length; h++){
  cDataMatrix[h] = [];

  for(var k = 0; k < data.length; k++){
    cDataMatrix[h][k] = 0;
  }
}

// Fill the matrix with product count values
data.forEach(function(d){
  for(var a = 0; a < productVals.length; a++){
    if(d.productCount){
      cDataMatrix[d.id][d.id] = d.productCount;
    } 
  }
});

// Generate the chord layout
var chord = d3.layout.chord()
  .padding(.1)
  .matrix(cDataMatrix);

var ch = d3.svg.chord()
  .radius(300)
  .startAngle(function(d, i){
    return arcScale(i*(Math.PI/179.2));
  })
  .endAngle(function(d, i){
    var degree = i+0.8;
    return arcScale(degree*(Math.PI/179.2));
  });

// Draw the chords on the arc
var chords = indArcBody.append("g")
  .attr("class", "chords");

chords.selectAll("path.chord")
  .data(chord.chords)
  .enter().append("svg:path")
  .attr("class", "chord")
  .style("fill", "#000")
  .attr("d", ch);

これがそのデモです: http://jsfiddle.net/developerAndADj/68WRT/

各コードをそれぞれのパス要素に並べることは可能ですか? また、各パス要素の内側の半径から円弧の下にあるパス、または SVG で指定された座標に向かうコードまたは曲線を使用することは可能ですか?

フィードバックをお寄せいただきありがとうございます。