ko31 Adventar にはすでに昨年を上回る勢いの310以上（11月17日時点）のアドベントカレンダーが作られているようで、12月に向けてどんどん盛り上がっているようですね。
さて、そんなアドベントカレンダーには数時間で満員御礼になるものもあれば、なかなか参加者が増えないものもあるわけですが、ページを一目ぱっと見ただけではその様子は分かりにくいものです。試しに登録状況データを可視化してみました。
ちなみに可視化したできあがりはこんなページになります。（画像をクリックするとサンプルページに飛びます。）
※このデモページは cron で1時間毎に更新してますが、データを無許可でスクレイピングしてますので、もし Adventar の方に注意されるようでしたらやめます。2015/12/26：アドベントカレンダーも終わったのでcronを止めました。
登録状況のデータをスクレイピングで取得
まず、Adventarのページをスクレイピングして各カレンダーのデータを取得します。
スクレイピングには Goutte を使用しています。
この php をコマンドラインから実行すると、各カレンダーのデータ（タイトル、URL、背景色、登録件数）を取得した json ファイル（adventar.json）が、同じディレクトリに出力されます。
D3.jsのツリーマップを作成
作成した json ファイルを読み込んで、ツリーマップを表示します。
D3.js のツリーマップはこちらのサンプルを参考にしました。
以下、作成したツリーマップについての補足です。
- タイトルの後ろにあるカッコ内の数字が参加登録件数です。
- 各ブロックをクリックするとアドベントカレンダーのページに飛びます。
- 各ブロックの背景色はAdventarのものに合わせています。
- 「登録件数」「タイトル文字数」ラジオボタンを選択するとそれぞれの割合にアニメーション切り替えします。（アニメーションさせたかっただけで、タイトル文字数の値には何も意味はありませんｗ）
参考までに、使ったソースコードは GitHub に UP してあります。
おわりに
データビジュアライゼーションなんていろはの「い」も知らないので、このデータをツリーマップで可視化することが適切だったのかもよく分かってませんが、とりあえずやってみたいからやってみました。もしツッコミなどございましたら大歓迎です！
さて、自分が今年作成した「作業用BGM」は、ツリーマップにするとこの辺りに入ってるようです。まだまだ小さいですね！
何となく前後に並んでいるカレンダーに親近感が湧いてきたりしつつも、やっぱり最後にはもっと大きく右の方に移動しているようになってるといいなーと。。
ちなみに、Qiita のアドベントカレンダーでも同じことをしてみようと思ったんですが、一覧を取得できるページがすぐに見つからなかったのでとりあえずやめました。もしページがあるようでしたら、時間のある時にまたやってみたいと思います。
