PythonとJavaScriptではじめるデータビジュアライゼーション

383

17.5　データのネスト

var i = nbviz.CATEGORIES.indexOf(category);

//

等間隔の色相を返す

return d3.hcl(i / cats.length * 360, 60, 70);

};

時系列グラフのすべての静的要素を取り上げたので、

D3

の

nest

ライブラリで利用可能な形式

にしてみましょう。

17.5

 データのネスト

この時系列コンポーネントを作成するために、受賞者オブジェクトのフラットな配列を時系列グ

ラフの各ノーベル賞受賞にバインディングできる形式に再構築します。

D3

でこのデータをできる

だけスムーズにバインディングするには、年ごとの受賞者オブジェクトの配列で年グループを配列

として利用します。ノーベル賞データセットを使ってこの変換処理を示しましょう。

以下は、年の順に並んだ最初のフラットなノーベル賞データセットです。

// var data =

[

{"year":1901,"name":"Wilhelm Conrad R\\u00f6ntgen",...},

{"year":1901,"name":"Jacobus Henricus van \'t Hoff",...},

{"year":1901,"name":"Sully Prudhomme",...},

{"year":1901,"name":"Fr\\u00e9d\\u00e9ric Passy",...},

{"year":1901,"name":"Henry Dunant",...}, ...