美しいグラフは、ユーザーの興味を惹くことができるため、訴求力が高まります。
また、わかりやすさも向上するため、アプリケーションの使い勝手も向上します。
簡易比較表
無料/有料 | グラフの種類 | サンプル | 複合グラフ | |
---|---|---|---|---|
High Charts | × | ◎ | ◎ | ◎ |
Google Chart Tools | ◯ | ◎ | △ | ◎ |
Raphael.js | ◯ | ◯ | ◯ | △ |
ccchart | ◎ | △ | ◎ | ◎ |
各々長所と短所があるので、状況に合わせて使い分けてください。
上から順におすすめです。
High Charts
サンプルページ
http://www.highcharts.com/demo/
長所
- 円グラフや棒グラフを簡単に組み合わせることができる
- アニメーションがきれい
- サンプルが豊富
- 商用ライセンス
http://www.highcharts.com/download
Google Chart Tools
サンプルページ
https://developers.google.com/chart/interactive/docs/gallery
長所
- 無料
- HighChart並みの表現力、柔軟性がある
- サンプルが貧弱
https://www.google.com/jsapi
Raphael.js
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhULBNfZKc92Qjo4gH8rgdIZIy6hxv1cYCEh0tNMgKfxRMT_62B53CHE47AZodevafmrBl9T-xG4TPmRSjmNRKzRVg3P0GAIUNUDIXfLxMdm3-l0jMS1haYELuO7GwZNxKlQ3zM28bshXE/s320/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88+2012-08-20+9.52.09.png)
サンプルページ
http://raphaeljs.com/
長所
- 単体のグラフを作成するなら、これが一番きれい
- 無料
- 複合グラフを作成するためには、elychartsというプラグインが必要
- elychartsのサンプルが汚い
http://raphaeljs.com/
ccchart
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9dfrBl-9mgNWzBvNPlvPgpVJAPzqkw22erF5iLgvvBO-bdl1b9bwQ-pLsdLXctgjH77_RgJflNefpK_fycSIFeKKr5UskzJloV0ub-Yqm9nZ68O5R3Oxk_-WjNcWq3e12Oj38RB2UUrk/s320/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88+2012-08-20+9.54.41.png)
サンプルページ
http://jsgt.org/c/
長所
- ライセンスがpublic domain(無料)
- サンプルが豊富
- 複合グラフを簡単に作成できる
- 円グラフを作成できない(現在実装中)
http://jsgt.org/c/js/ccchart.js
0 件のコメント:
コメントを投稿