html5ライブラリ
html5.0のcanvasライブラリが公開されています。
レーダーチャートやグラフなどが作れて優れものです。
折れ線グラフなどは
var rc = new html5jp.graph.radar("sample");
var items = [
["商品A", 5, 2, 4, 5, 3, 2, 4, 4],
["商品B", 3, 4, 3, 4, 5, 4, 5, 1]
];
var params = {
aCap: ["安さ", "性能", "デザイン", "人気", "使いやすさ", "寿命", "軽さ", "強さ"]
}
rc.draw(items, params);
という実装で、後はsampleというidのcanvasをHTML上に定義するだけでOKです。
使い勝手もなかなか良いです。
なお、IE7ではexcanvasが必要です。
ただ、ちょっとAjax対応できていないので、その当たりは改良が必要かと思います。
drawのリロード処理や、消去処理などちょっと工夫が必要です。
でも、いい感じですね。
グラフ作るのに、Flash使おうか、こちら使おうか迷います。
Posted in JavaScript |
