365
Help us understand the problem. What are the problem?

More than 5 years have passed since last update.

posted at

updated at

Javascriptで扱えるカッコイイグラフのまとめ

結論:Highchart

ccchart(canvasChart)と悩みましたが、Highchartを選んだ理由は、下記の通りです。

1.円グラフや棒グラフを組み合わせた複合的なグラフのサンプルを載せている
2.複合グラフのアニメーションがかっこいい

商用ライセンスなので、無料にこだわる方は、ccchart(canvasChart)がおすすめです。

Highchart

表現力、完成度の点でいちばんだと思います。商用なのでお金さえあればこれがイチオシ。

ccchart(canvasChart)

私のイチオシは canvasChart です
ライセンスは PUBLIC DOMAIN!

raphael.js

qiitaのプロフィールの円グラフで使われているjQueryプラグイン
美しめなグラフを作成することができる。
raphael.jsのプラグインのelycharts.js
http://elycharts.com/docs

Google Chart Tools

https://developers.google.com/chart/

Google Chart Tools も良いかと思いますが、 3D棒グラフが出来たかどうかが謎です。

僕が自分で使おうと決めたのはこれ。デモを見ただけだと貧弱に見えるのですが、グラフの種類とオプションなど柔軟性があり、アニメーションやドロップシャドウなどもできて、実はHighChart並の表現力と柔軟性があります。オープンソースなので、気軽に使えますし、プログラミングしがいがあります。

SenchaTouch Chats

これも表現力、種類など十分です。ただ円グラフの凡例がちょっと独特だったので、見送りました。

Flot
http://code.google.com/p/flot/
Flotr
http://solutoire.com/flotr/
jqPlot
http://www.jqplot.com
jQuery Sparkline
http://omnipotent.net/jquery.sparkline/
jQuery-Visualize
https://github.com/filamentgroup/jQuery-Visualize
MilkChart
http://mootools.net/forge/p/milkchart
moochart
http://moochart.coneri.se/
MooWheel
http://www.labs.unwieldy.net/moowheel/
PlotKit
http://www.liquidx.net/plotkit/
table2chart
http://mootools.net/forge/p/table2chart
TufteGraph
http://xaviershay.github.com/tufte-graph/
YUI Charts
http://yuilibrary.com/yui/docs/charts/

上記は、html5のユーザーグループへの投稿に対する返信をまとめたものです
https://groups.google.com/forum/?fromgroups#!topic/html5-developers-jp/dmkGbLJ6CAo

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Sign upLogin
365
Help us understand the problem. What are the problem?