web-dev-qa-db-ja.com

JavaScriptチャートライブラリ

誰かが特定のJavaScriptチャート作成ライブラリー、特にフラッシュをまったく使用しないものをお勧めしますか?

223
Steve M

Flashを必要としない、純粋なJavaScriptチャート作成用のオープンソースおよび商用ソリューションが増えています。この回答では、オープンソースのオプションのみを紹介します。

Flashを必要としないグラフィック用のJavaScriptソリューションには、主に2つのクラスがあります。

  • キャンバスベース、ExplorerCanvasを使用してIEにレンダリングされたもので、VMLに依存する
  • IEでVMLとしてレンダリングされた、標準ベースのブラウザでのSVG

両方のアプローチの長所と短所がありますが、それはDOMとうまく統合されていて、そしてDOMイベントでチャート要素を操作することを可能にし、そして最も重要なことにDOMイベントを設定できるので、私は後者をお勧めします。対照的に、Canvasチャート作成ライブラリはDOMホイールを再発明してイベントを管理する必要があります。そのため、イベント処理を行わずに静的グラフを作成する予定がない限り、SVG/VMLソリューションの方が優れているはずです。

SVG/VMLソリューションには、次のような多くの選択肢があります。

Raphael はIE 6〜8、Firefox、Opera、Safari、Chromeを含む非常に優れたクロスブラウザサポートを備えた非常に活発で、手入れが行き届き、成熟した、オープンソースのグラフィックライブラリです。 、そしてKonqueror。 RaphaelはどのJavaScriptフレームワークにも依存しないため、Prototype、jQuery、Dojo、Mootoolsなどで使用できます。

以下を含む、Raphaelに基づくチャート作成ライブラリがいくつかあります。

  • gRaphael 、Raphaelグラフィックライブラリの拡張
  • Ico 、単一の関数呼び出しに基づく直感的なAPIにより複雑なチャートを作成

情報開示:私は githubのIcoフォークの1人 の開発者です。

160
Jean Vincent

あなたがjQueryを使っているのであれば flot とても良いと思います - examples を試してみて自分のニーズに合っているか確かめてください。現在のプロジェクトに必要なもののほとんど。

さらに ExtJS 4. は非常に強力なチャートの素晴らしいセットを導入しました、そしてライブデータを扱うように設計されています。

70
Bittercoder

チェックアウト http://www.highcharts.com

Highchartsは純粋なJavaScriptで書かれたチャートライブラリで、WebサイトやWebアプリケーションにインタラクティブなチャートを簡単に追加する方法を提供します。ハイチャートは現在、折れ線チャート、スプラインチャート、エリアチャート、エリアスプラインチャート、列チャート、棒チャート、円グラフ、および散布図をサポートしています。

60
Torstein Hønsi

[.________。] Google Chart API とてもクールで使いやすいです。

36
Jan Gressmann

SVGに基づいた別のJavaScriptライブラリがあります。これは Protovis と呼ばれ、Stanford Visualization Groupからのものです。

それはまた素晴らしいインタラクティブなグラフィックや視覚化をすることを可能にします。

http://vis.stanford.edu/protovis/ex/

それは現代のWebブラウザ専用ですが

更新:protovisチームは、d3.js(Data Driven Documents)という別のライブラリに移動しました。

"Protovisチームは現在、アニメーションとインタラクションのサポートを改善した新しいビジュアライゼーションライブラリD3.jsを開発しています。D3はProtovisの多くの概念を基にしています。"

新しいライブラリは、次の場所にあります。

http://mbostock.github.com/d3/

アップデート2:

"人力車"は、インタラクティブな時系列グラフを作成するためのJavaScriptツールキットです。 d3.jsをベースにしたもので、d3.jsを使用した作業は非常に単純化されていますが、少し強力ではありません。

http://code.shutterstock.com/rickshaw/

15
Fgblanch

jqPlot 素晴らしいです。あなたの要求がかなり「普通」で、単にいくつかのチャートを描きたいのであれば、おそらくあなたはjsチャートオプションの数に圧倒されているでしょう。あなたが何時間もの研究をしたくないのなら、jqPlotを使ってください。それはほとんどの人のためのほとんどのユースケースをうまくカバーしています。代替案の中には、特定の種類のチャートに特化したものや、特定のユースケースを考慮して作成されたものがあります。

14
Fletch

私は最近javascriptチャート作成ライブラリを探していましたが、私の要件に非常によく合う jqplot に落ち着く前に、全体の束を評価しました。 Jean Vincentの答えが述べたように、あなたは本当にキャンバスベースのソリューションとsvgベースのソリューションのどちらかを選択しています。

私の考えでは、主な長所と短所は次のとおりです。 SVGベースの Raphael (そしてoffshoots)のようなソリューションは、非常に動的な/インタラクティブなチャートを作成したい場合に最適です。チャート作成の要件が標準を大きく超えている場合(たとえば、何らかの種類のハイブリッドチャートを作成したい場合、または他に誰も考えていない新しい視覚化を思い付いた場合)。欠点は学習曲線とあなたが書く必要があるコードの量です。数分でチャートを作成して、実際の学習時間を費やしてから、比較的単純なチャートを作成するための十分な量のコードを作成する準備をすることはできません。

グラフ作成の要件が標準的であれば、対話機能が制限された折れ線グラフや棒グラフ、あるいは円グラフまたは2つのグラフが必要な場合は、キャンバスベースのソリューションを検討する価値があります。基本的なチャートを数分以内に作成することができるでしょう、あなたは多くのコードを書く必要はないでしょう、基本的なjavascript/jqueryの数行はあなたが必要とするすべてであるでしょう。もちろん、ライブラリでサポートされている特定の種類のチャートしか作成できません。通常はさまざまな種類の折れ線、棒グラフ、円グラフに限られます。対話性の選択は非常に限られたものになるでしょう。つまり、そこに存在する多くのライブラリには存在しないということです。

キャンバスベースのソリューションであるJQplotを使いました。標準的な種類のチャートしか本当に必要としなかったからです。私の調査といろいろな選択をして遊んでみると、それが合理的にフル機能(標準チャートの後に限られている場合)であり、非常に使いやすいことがわかりました。

簡単に要約してグラフを作成するには、JQplotを使います。複雑で/違っていて時間がないとされていないラファエルと友達と行きます。

14
skorks

ある種の遅れた答えとして、d3.jsを試してみてください。
http://mbostock.github.com/d3/

それはprotovisの続きです。
flotの大きな違いはサポートされている機能の数です。
flotはもっと単純かもしれませんが、d3.jsは間違いなくもっと強力です。

4
Stefan Steiger

PlotKit をお試しください

3
Jason Bunting

もう1つはRGraph:Javascriptチャートとグラフライブラリです。

http://www.rgraph.net

キャンバスベースなので高速で、およそ20種類のチャートタイプがあります。非営利目的の使用も無料です。

3
Richard
3
vPJ

Flotr はPrototypeに基づいた、純粋なJavascriptチャートライブラリです。 Flot

3
Argelbargel

私は gRaphaël それが構築されている純粋なJavaScriptベクトルグラフィックライブラリと一緒に純粋なJavaScriptチャートを作成することをお勧めします( Raphaël )。

現在、ラファエルはFirefox 3.0以降、Safari 3.0以降、Opera 9.5以降、およびInternet Explorer 6.0以降をサポートしています。

3
Peter McG

Google Visualization API をチェックしてください。これは単純化したものを一般化したものです Chart API

2

新しいスタートアップ用に TechOctave Charts Suite のライセンスを購入しました。私はそれらを強くお勧めします。ライセンスは簡単です。チャートは素晴らしく見えます!始めるのは簡単で、必要なときには強力なAPIがあります。私は、コードがどれほどクリーンで拡張可能であるかにショックを受けました。私たちの選択に本当に満足しています。

2
Aaron Reis

私のお気に入り(flot)はすでに言及されています。

しかし、必ず調べてください オルソ 。ツリーチャートやタイムラインに最適です。

2
Rui Vieira

Dojoチャートライブラリにはたくさんのアクティビティがありますが、AIRアプリケーション内で問題なく使用しているのは素晴らしいことです。例えばそこを参照してください http://www.sitepen.com/blog/2008/05/27/dojo-charting-event-support-has-landed/

2

http://code.google.com/apis/visualization/documentation/gallery.html

地図、ゲージ、チャートなど、非常にクールなインタラクティブオプションがあります。

2
Ryan Charmley

チャートにすることができるMIT簡単なタイムラインをお試しください - http://simile.mit.edu/timeline/

または最後のもの、 http://code.google.com/p/gchart/

2
Chii

プロトチャートはあなたが必要とするすべてです

1
Vince Panuccio

より珍しいチャートの場合: http://thejit.org/

1
PhoebeB

SenchaはRaphaelを買収しました、そして今彼らのチャートはバージョン4の時点で純粋なjavascriptです。上記のEmpriseとHighChartsは私の2つのお気に入りです。

http://www.sencha.com/

1
Justin Thomas

Bluff を見てください。これはRuby用のGruffグラフ作成ライブラリのJavaScriptポートです。

1
John Topley

Javascriptライブラリではありませんが、適切な代替方法かもしれません。チェックアウト Google Charts クエリ文字列データをWebサービスに渡すことでチャートを生成できます。

1
Luke Bennett

チェックアウト ZingChart HTML5キャンバス、SVG、VML、Flashチャート 。非常に強力で互換性のあるライブラリ私はZingチームに所属しています - Twitterで私たちに言及してください @ zingchart または[email protected]に質問をしてください。

0
Andrew Begin

あなたが必要とするものが棒グラフだけである場合には。私は古いプロジェクトで使っていたコードをいくつか公開しました。最近のバージョンのIEではVMLの実装が壊れていると誰かに言われましたが、SVGは問題なく動作するはずです。プロジェクトに戻って、私がすでに持っているサーバーサイドのレンダラーと、おそらくWebGLレンダリングレイヤーをリリースするかもしれません。リンクがあります: http://blog.conquex.com/?p=64

0
Ivan Mishonov

おそらく、OPが探しているものではありませんが、この質問がJSチャートライブラリオプションのリストになったので、 jQuery Sparklines は本当にクールです。

0
Fletch

フュージョンチャート 新しいjavascript/jqueryライブラリが有望に見えます。

0
amurra

お勧めできます ArcadiaCharts 。 JavaScriptとGWT用の真新しいプロフェッショナルチャート作成ライブラリ。プラグインなしですべてのブラウザで動作します。簡単で早く使える:ほんの数行のコードで見栄えの良いチャートを作成できます。非営利目的での使用は無料です。

0
Hoang-Tran Vo