d3.js - D3.js:グループに異なる量の要素を追加しますか?

Question

グラフ表現を作成しようとしていますが、データを整理する方法がわかりません。

現在、すべてのデータがグループにバインドされており、ノードを描画しています。

データにはエッジのリストが含まれていますが、ノードごとにエッジの数が異なるため、それらを描画する方法がわかりません。

var group = svg.selectAll("g").data(dataset).enter().append("g);

//this works

group.append("circle")
     .attr(...).attr(...).attr(...);

//what to do here? when I call group, it will loop through each node ONCE and append a path
//but I need it to append edges.length paths for each pass

group.append("path")
     .attr("d", function(d,i){

        //example of 1 line
        lineSeg = [];
        lineSeg.push({"x":d.x ,"y":d.y});
        lineSeg.push({"x":d.edges[1].x ,"y":d.edges[1].y});

        return line(lineSeg);

     });

編集：

//just to add dom structure, my goal is for it to be:

g:
   circle
   path1
   path2

g:
   circle
   path1
   path2
   path3

g:
   circle
   path1

etc...

関連するチュートリアル ページにリンクされている Lars。私にとっての鍵は、ネストされたデータ結合でした

var td = d3.selectAll("tbody tr")
.data(matrix)
.selectAll("td")
.data(function(d, i) { return d; }); // d is matrix[i]