y-matsui::weblog

電子楽器、音楽、コンピュータ、プログラミング、雑感。面倒くさいオヤジの独り言

Javascriptでグラフ

「膨大なログを可視化するのにグラフは必須」ということで、グラフ機能の追加なのだが、サーバサイドでゴリゴリとオブジェクトやら画像データやらを生成するのは、サーバーに申し訳ない。
そこで、「クライアントにやらしてしまえ」→Javascriptのグラフコンポーネントとなるわけ。
・・で探してみた
http://wwwrsphysse.anu.edu.au/~mxk121/javascript/jsDataPlotDouble.html
http://homepage3.nifty.com/slokar/js/jsgraph.html

DataPlotの方は、テキストエリアにCSV区切りの2次元配列を渡すだけで簡単にグラフが出る。
JSGRAPHは、なにやら専門的な感じのサンプルが出てくるが、軸ラベルをドラッグできちゃったりして、よく出来ている。
要は、文書管理システムのログ解析機能として、”簡単にデータを生成でき”、”簡単に実装できる”という点が重要なので、VMLだのCanvasだのという要素レベルの知識を要求されちゃうと困る。

同僚も巻き込んで、今日1日はログ関連機能に掛かりっきりであった。
ログの属性値を拡張して、既存のプログラム60本のログ記述部分を変更するだけでも、大変な手間である。同僚が、どこかからか拾ってきたJSプログラムで、ログ解析機能をつけたのだが、これがまた素晴らしい。ログの検索条件として、操作内容、ユーザ、日付範囲指定などの様々な条件を指定できるのであるが、これに”日ごと””ユーザごと””円グラフ””棒グラフ””折れ線グラフ”なんていうグラフ生成条件をプラスして、ぽいぽいと検索条件を変えて、即座にグラフが出る。
ログ種別:ログイン
集計:日毎
グラフ:折れ線
・・・で選択すれば、ログインユーザ数のグラフがぽん!と瞬時に出ちゃうし、編集、登録、削除なんかもドロップダウンで切り替えれば即座にグラフが切り替わる。
ログをCSVで書き出してエクセルでグラフを生成して・・・なんてやっているよりも全然早い!
まだ項目軸や目盛りの描画、描画領域の制御や、グラフの圧縮、属性のポップアップ表示、上位○○件ランキング表示などなど、追加しなければいけない機能は山ほど残っているが、ログをJavascriptで描画するアイディアが大成功である感触だけは十分に感じている次第。