は、私はこのような方法で、チームコラボレーションデータを視覚化しようとしています

Question

をネストd3.jsで作成したオブジェクト階層フラット化：チャートで

異なる色を異なるコラボレーション案件タイプです。データは、単一の日のために与えられていることを

var json = [ 
    { 
     "teamLabel": "Team 1", 
     "created_date": "2013-01-09", 
     "typeLabel": "Email" 
     "count": "5" 
    }, 
    { 
     "teamLabel": "Team 1", 
     "created_date": "2013-01-10", 
     "typeLabel": "Email" 
     "count": "7" 
    }, 
    /* and of course, a lot more data of this kind */ 
] 

注：

ソースからのデータは、次のようになります。だから、上記の視覚化のために、私は年の最初の週に基づいてデータを集計する必要があります。チーム名と成果物タイプは保存する必要があり、グループ化属性として使用されます。コードは次のとおりです。

// "2013-01-09" 
var dateFormat = d3.time.format.utc("%Y-%m-%d"); 

// "2013-02" for the 2nd week of the year 
var yearWeek = d3.time.format.utc("%Y-%W"); 

var data = d3.nest().key(function(d) { 
     return d.teamLabel; 
    }).key(function(d) { 
     var created_date = dateFormat.parse(d.created_date); 
     return yearWeek(created_date); 
    }) 
    .key(function(d) { 
     return d.typeLabel; 
    }).rollup(function(leaves) { 
     return d3.sum(leaves, function(d) { 
       return parseInt(d.count); // parse the integer 
      }); 
     } 
    ) 
    .map(json); 

この結果、ネスティングキーに基づくオブジェクト階層が作成されます。私はこのことから、上記のグラフを作成する方法を見ていないので、私はむしろ、次のような構造にdataを変換する方法を探しています：

[ 
    // This list contains an element for each donut 
    { 
     "teamLabel": "Team 1", 
     "createdWeek": "2013-02", 
     "values": [ 
      // This list contains one element for each type we found 
      { 
       "typeLabel": "Email", 
       "count": 12 
      }, 
      { 
      ... 
      } 
     ] 
    }, 
    { 
    ... 
    } 
] 

この方法では、私はX上の位置決めのためにcreatedWeekとteamLabelを使用することができますy軸とし、valuesの情報はd3.layout.pie()に渡すことができます。

このデータ変換を行うための明確な方法はありますか？詳しい説明や詳細が必要な場合は、私に知らせてください。

Answer 1

あなたがそれを行う方法は次のとおりです。私はmap.entries（）ヘルパー関数を使用するために、代わりに標準のJavaScriptオブジェクトのd3.map使用してい

var flat = data.entries().map(function(d){ 
    return d.value.entries().map(function(e){ 
     return { 
      "teamLabel": d.key, 
      "createdWeek": e.key, 
      "values": e.value.entries().map(function(f){ 
       return {"typeLabel": f.key, "count": f.value} 
      }) 
     } 
    }) 
}).reduce(function(d1,d2){ return d1.concat(d2) },[]); 

注意。代わりに、ここで

.entries(json); 

jsFiddleリンクの

.map(json); // whereas I used .map(json, d3.map) 

：

http://jsfiddle.net/RFontana/KhX2n/