Storyline your Repository

見える化がトレンドな昨今、開発状況のそれをよりビビッドにやってくれる楽しいツールにevolinesというものがあります。
ここではその導入の仕方をメモっておきます。

必要なもの

  1. Processing
  2. Javaが使える環境
  3. JUNG (Java Universal Network/Graph Framework)
  4. そこそこ人が多くいそうなリポジトリの目処

それぞれProcessing, JUNGは公式ページからzipを落としてきて, 適当な場所に配置しておきます.

ライブラリとかの準備

まずはevolinesのソースを適当な場所に展開しましょう

% svn checkout http://evolines.googlecode.com/svn/trunk/ evolines-read-only

おそらくこんな感じのディレクトリツリーができあがっていることでしょう.

次にevolinesが利用しているJUNGを組み込むための手順が必要です.
Storylinesディレクトリの直下にcodeというディレクトリを作成し, そこにJUNGに含まれるjarファイルを突っ込みます.*1

リポジトリログの取得

よさげなリポジトリは見つけましたか?
ではそこからグラフを作るための材料になるログをゲットしましょう。
通常git log やsvn log等のコマンドでリポジトリのログが取得できると思いますが, これだと様々なVCSでばらばらのため非常にやりづらいです.
このやりづらさを解消し、一発でまとめてあつかうためのスクリプトがあります。evolinesの作者さんが別のプロジェクトで作っているものです*2. これを持ってきてログを整形します.
スクリプト自体は以下のURLにあるので適当に引っ張ってきましょう

% wget http://codeswarm.googlecode.com/svn/trunk/convert_logs/convert_logs.py


さて、ではログを採取します. ここではfrsyuki先生のmsgpackのリポジトリを試して見ます.

% git clone https://github.com/msgpack/msgpack.git
...
% cd msgpack
% git log --name-status --pretty=format:'%n------------------------------------------------------------------------ %nr%h | %ae | %ai (%aD) | x lines%nChanged paths:'  > ~/msgpack.log
% cd $HOME
% python convert_logs.py -g ~/msgpack.log -o ~/msgpack_log.xml  

svnだと"svn log -v"ぐらいで済むのですが、gitだと少しオプションを調整してやる必要があるようです.
なおsvnの場合はconvert_logs.pyを実行する際に"-g"ではなく"-s"を用います.

コンフィグ

ログの採取が終わったら、あとはどのような出力をするか、を決めてやる必要があります.
先ほど展開したevolinesディレクトリ内のStorylines/config/sample.configを弄りましょう.
SVGで出力した方が楽しいのでここではこのための設定を記述しています. 他にもProcessing 上でインタラクティブに触ったり, PDFに出力したりといったことができます.
今回はこれくらいの設定で充分でしょう

ProjectName=msgpack

# Data input : 先ほどゲットしたXMLファイルへのパス
RepositoryFile=/path/to/msgpack_log.xml

# Output
WriteToPDF=false
WriteToSVG=true
# Output File Prefix : 出力先ファイル名(拡張子が内部分)
OutputPrefix=msgpack-repo

# Visual variables
ScreenWidth=1200
ScreenHeight=800

さて実行! とその前に

さて、Processingを起動してStorylines/Storylines.pdeを読み込んでRunボタンで実行すれば終了!


と、行きたいところなのですがいくつか上手くいかないところがあったのでメモ.

1. Arrayがなんかおかしー

以下のスクショの部分で引っかかる場合があります.

Processing側のライブラリではなく, java側のライブラリを呼び出そうとしているのが原因のようです. 以下の一行をCluster.pdeの先頭に付け加えると上手く動きます.

import java.util.Arrays;
2. ぬるぽ

第二のエラーはこれです。ぬるぽ

問題はStorylines.pdeの969行目にあります

967    if ( line.startsWith( "<event" ) )
968    {
969      XMLElement eventXML = new XMLElement( line );

ここで969行目はlineに含まれるeventタグからXMLElementのインスタンスを生成しようとしています. しかしXMLElementのコンストラクタはXML文字列を受け取りません。結果、eventXMLが きちんと生成されないのです。
ここでは以下のように書き換えてやる必要があります。

969     XMLElement eventXML = XMLElement.parse( line );

これで、コンフィグが間違ってなければ動くはず!

出力結果

しばらく待つとconfigファイルのOutputPrefixで指定した名前のファイルができあがります。
大きなプロジェクトだと数分から数十分かかる場合がありますが、辛抱強く待ちましょう

なかなか色が綺麗で観ていても楽しいのですが, このSVGファイルを対応ブラウザで開くともう少し楽しめます。たとえば適当なラインにマウスをオーバーラップさせるとこんな感じになります。ある人の活動履歴だけを協調表示できたりするのでした。

おしまい

*1:本来的にはCLASSPATHにあるところならどこでも良いらしいのですが, めんどくさい&うまくいかなかったので...

*2:なおこちらのcodeswarmもなかなかおもしろい