d3 advent calendar 4日目
d3にあるその他の Array Operatorの紹介
特筆すべきは、d3.rangeとd3.nestです。特にnestは非常に有用なので覚えて損はないです！
d3.split
最初のnull / undefinedで分割され、それまでの配列が返される。functionが定義されていれば、trueを返すまでの配列が返される
実例：d3.split
var array = d3.range(0, 100, 5); // [0, 5, 10, ... , 95, 100]
d3.split(array); // [0, 5, .., 100] nullもundefinedも無いから
d3.split(array, function(d){ return d > 50; }); // [0, 5, 10, .., 50]
d3.range([start, ]stop[, step])
startがなければ0、stepがなければ1ずつでstopまでの配列を返す便利関数
実例：d3.range
d3.range(50) // [0, 1,...,50]
d3.range(25, 50) // [25, 26, .., 50]
d3.range(25, 50, 5) // [25, 30, 35, .. , 50]
補足：d3.time.days(start, stop[, step])
日時で.rangeと同じことができます！これ、便利です
d3.time.days(new Date(2012, 0, 1), new Date(2012, 1, 1))
// [Sun Jan 01 2012 00:00:00 GMT+0900 (JST),Sun Jan 02 2012 00:00:00 GMT+0900 (JST)..,Tue Jan 31 2012 00:00:00 GMT+0900 (JST)]
d3.time.days(new Date(2012, 0, 1), new Date(2012, 1, 1), 7)
// [Sun Jan 01 2012 00:00:00 GMT+0900 (JST),Sun Jan 08 2012 00:00:00 GMT+0900 (JST)..,Tue Jan 31 2012 00:00:00 GMT+0900 (JST)]
d3.nest()
これはすごく便利です。視覚化したいデータは大抵、オブジェクトの配列だと思います
これを特定のkeyでネストすることが可能です
d3.nest()でnestオブジェクトを作成し、.key(function)でネストのkeyを定義します
最後に.entities(data array)で渡し、ネストされた配列を得ることができます
実例：d3.nest()
var data = [
{year: 1992, item: 1},
{year: 1995, item: 1},
{year: 1992, item: 3},
{year: 1996, item: 3},
{year: 1996, item: 3}];
d3.nest()
.key(function(d){return d.year;})
.key(function(d){return d.item;})
.entries(data);
実例：d3.nest() 続き
// [
// {key: 1992, values: [
// {key: 1, values: [{year: 1992, item: 1}]},
// {key: 3, values: [{year: 1992, item: 3}]}
// ]},
// {key: 1995, values: [
// {key: 1, values: [{year: 1995, item: 1}]}
// ]},
// {key: 1996, values: [
// {key: 3, values: [{year: 1996, item: 3}]}
// ]}
//]
その他
- d3.merge(array's array): 正直[].concatで十分
- d3.permute(array, indexes): arrayの中身をindexesの順序で並び替えてくれる
- d3.zip(arrays): underscore.zipと同じ
