New in 4.0 Colors plugin Default palette of Chart.js brand colors is available as a built-in time-saving zero-configuration plugin.
Our core library. Includes all standard chart types and more.
RocketchartはHTML5で作られたダイナミックなグラフライブラリです。 HTML5でできることがどんどん広がっています。今回紹介するRocketchartsもHTML5を駆使しています。そしてすごいグラフを作ってきました。 ローソクチャートです。HTML5で作られています。 折れ線グラフを追加しました。 さらに棒グラフと折れ線グラフのミックスです。 クリックするとその箇所の数値が分かります。 表示範囲をマウスで選択して絞り込むこともできます。 逆に広げた場合です。 RocketchartはJSONデータを使ってCanvasタグにグラフを描いています。そのため直接書き出すのはもちろん、AjaxなどでJSONデータを渡してレンダリングすることもできそうです。 RocketchartはJavaScript製、GPL v3のオープンソース・ソフトウェアになります。 MOONGIFTはこう
JITはJavaScriptを使ったデータビジュアル化ライブラリです。 JavaScriptを使ってWeb上でデータを多彩にビジュアル化するライブラリがJavaScript InfoVis Toolkit（JIT）です。その多彩な表現をご覧ください。 積み上げのエリアグラフです。表示の際にはアニメーションが実行されます。 実際のコードです。 棒の積み上げグラフです。 横向き、2Dのグラフです。 関連グラフです。マウスで動かせます。 マウスオーバーで説明が表示されます。 こんなグラフもあります。 星形。格好いいです。 カスタマイズにも多様に対応しています。 容量の表示などによく利用されるツリーマップです。 こちらもパターンが色々用意されています。 グラフを組み合わせたパターンです。 こんな表現も可能です。 派生していくアニメーションが格好いいです。 円グラフです。アニメーションやマウス操作に
JointはUMLや家系図、ER図などをダイナミックに描くJavaScriptライブラリ。 JointはJavaScript製のオープンソース・ソフトウェア。Webでは簡単に表現できることから、テキストベースでのコンテンツが多い。だがテキストに溢れたWebサイトというのは見ていて疲れてしまうものだ。グラフがあるとインパクトも大きい。 家系図 だがデータベース等にあるデータをWeb上で表現するのは大変で、サーバ側での何らかのライブラリが必要になるケースが多い。そこで使ってみたいのがJointだ。 JointはJavaScriptで図を描くライブラリで、多彩な種類に対応している。例えば家系図、ER図、各種UML、DEVS、ペトリネットなどだ。さらにオブジェクト同士の接続方法も多様に用意されており、直線や曲線など多彩にある。接続を指し示すときの矢印すら数多い。 マウスで動かせる さらに面白いのは
Arborは複数のオブジェクトを関連性を含めてビジュアル化するライブラリ。 ArborはJavaScript/jQuery製のオープンソース・ソフトウェア。データをビジュアル化する方法は幾つか存在する。例えば棒グラフや折れ線グラフも一つのビジュアル化だ。どの方法を選ぶかはデータの種類と見せ方によって異なるだろう。 こんな表示も 幾つかのオブジェクト同士が関連して存在する場合に使えるのがArborだ。例えばソーシャルネットワークのユーザの関連性を表示したり、友人同士のつながりをビジュアル化するといった時に使えそうなライブラリだ。 Arborは幾つかのハブがあり、そのハブから枝が伸びて別なハブにつながっているようなビジュアル化を行う。表示して終わりという訳ではなく、常にゆらゆらと動いている。さらにハブをドラッグして移動させることもできる。その時には関連するハブも干渉して動く。 さらに複雑な描画
JSGanttはJavaScript製/Webベースのオープンソース・ソフトウェア。多人数、または複数社が関わるプロジェクトでは一つのタスクの結果が別なタスクに関わっていることが多々ある。そうした時の遅延はプロジェクト全体の調整が必要であり、滞りなく進めるのは至難の業だ。 JavaScriptでガントチャートを生成 そのためタスク間のスケジュールや関わり方を示すのにガントチャートがよく使われる。これまでのガントチャートは画像出力型が多く、生成後の再利用性が今ひとつだった。そんな不満を解消してくれるのがJSGanttだ。 JSGanttはその名の通りJavaScriptによるガントチャート生成ソフトウェアだ。縦にタスクが並び、横に日程が並ぶ。各タスクごとにスケジュールが帯になって表示され、その結果が別なタスクに線でつなげられる。タスクの関連性が見いだせるはずだ。 折りたたんだり表示範囲を変更
BirdEyeはFlash製のオープンソース・ソフトウェア。グラフ表示を行うライブラリは多数存在する。簡易的なものであればHTMLレベルで描くこともできる。さらに多機能なものが必要であればJavaScriptを使うこともできる。そして複雑なグラフを描きたければ導入したいのがFlashベースのグラフライブラリだ。 BirdEyeはFlash製のグラフライブラリだが、その機能は実に多彩になっている。あまり簡易的なグラフを描くのには向かないかも知れないが、逆に高度なものを必要とする際にはぜひチェックしたい。棒グラフや円グラフ等の一般的なグラフはもちろん、家系図のようなグラフを描くこともできる。 もちろんFlashを使っているので動的に表示を変更するインタラクティブなグラフを描くこともできる。棒グラフと範囲グラフ、折れ線グラフを吹く動的に組み合わせるようなものを作成可能とあって、高機能なグラフを描
今回のテーマは「グラフ」 データというものは、ただ一覧で表示するのではなく、グラフを使って見せたほうが効果的な場面は多い。細かな数字の違いなどは分かりづらくなるが、飛び抜けた数値を見つけ出したり一定の法則性を見出すには、表形式よりも分かりやすい。プレゼンテーションや報告書などの中で、グラフを利用している方も多いはずだ。 Webサービスを作る中でもそれは変わらない。さらにオフィス内の基幹システムでもWebブラウザで動作するものが増えている中、Webブラウザ上でグラフを表示してほしいという要望は増えつつある。とはいえ、画像を生成したり、細かな制御を行う汎用的なグラフを作成したりするのは難しい。 そこで使いたいのが外部のグラフ生成サービスやグラフライブラリだ。とくに最近ではJavaScriptやFlashを使って、サーバサイドでは用意をする必要なく使えるものも増えている。今回はそうした「グラフ」
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
