グラフを描画できるライブラリのまとめ

  • このエントリーをはてなブックマークに追加

こんにちは、工藤です。
今回はグラフを描画できるライブラリをご紹介します。

vis.js

1vis
サイト・サンプルへ

ネットワーク図を引っ張った時の動きが面白くて個人的に好きです。
あまりに複雑なものでなければアニメーションもサクサク動きます。


D3.js

2D3
サイトへ  サンプル一覧

かなり自由度が高いライブラリらしく、とにかくサンプルの数が豊富にあります。
慣れている人は自分で細かい作りこみもできそうですね。


cola.js

3cora
サイト・サンプルへ

サンプルはネットワーク図のようなものが豊富な印象です。
ブラウザ上で数値など変更して確認できるのが便利ですね。



CHARTIST.JS

4CHARTIST
サイトへ  サンプル一覧

こちらのライブラリの一番の特徴はありがたいことにレスポンシブ対応しているところです。
用意してあるサンプルのデザインもかわいらしいですね。


Chart.js

5Chart
サイトへ  サンプル一覧

フラットなデザインがとてもかわいらしいライブラリです。
HTML5のcanvasを使用して描画されています。


Flotr2

6Flotr2
サイト・サンプルへ

こちらもHTML5のcanvasを使用して描画されています。
クリックした箇所に点を打って折れ線グラフを描画できるなど、他とはまた違ったサンプルも用意されています。

執筆者:工藤[ WEBデザイナー ]

WEBデザイナー。 最近はWordPressを触るのが好きです。よろしくお願いします。

関連記事

プログラミング

SharePoint REST APIを使用してリストの情報を取得し、headerにナビを作る

SharePointで作成したリストの情報をREST APIを使用して取得してみましょう。 今回は、APIで取得した情報を、headerにリンクとして差し込んでみます。サイト全体共通のナビでも、リストを使用すると、一か所で管理できるので便利です。 目次1 前提条件2 1.REST APIで情報を取得2.1 REST APIのURL2.2 データを取得する処理3 2.取得した情報をheaderに表示 前提条件 SharePoint Online モダンUI カスタムJSが使用で […]

WordPress

WordPressで権限やユーザーごとに管理画面のサイドメニュー表示を切り分ける

デフォルトだといろいろな項目が表示されているWordPressの管理画面のサイドメニュー。 慣れていない人にはわかりづらいですよね。 また、権限によってデフォルトで非表示にしてくれたりもしますが、この部分は見せたくないな…ということも多いと思います。 今回はWordPressで権限やユーザーごとにサイドメニューの表示を変更する方法をご紹介します。 目次1 権限の種類について2 function.phpに記述する2.1 サイドメニューの非表示用のコード2.2 権限ごとに振り分け […]

プログラミング

jQuery+PHPで大容量ファイルを分割アップロードするお話

ファイルのアップロードを行う際に注意しないといけないのが「アップロード容量」と「タイムアウト」です。 どちらもサーバーの設定に関わるところでレンタルサーバーでは対処しきれないところもあり、大容量にするとそれだけアップロードに時間がかかりタイムアウトが発生しやすくなります。 そこでフロント側で分割してファイルをアップし、バックエンド側で受け取った後に結合するようにするとよいでしょう 注意すべき点として通常のPOSTでの送信ではないため、あらかじめそこら辺を考慮した処理が必要とな […]

株式会社8bit (エイトビット)

東京都目黒区でWebサイト制作、Webシステム開発などを行っております。
コーポレートサイトやWebサービスの企画・提案を得意としており、自社での経験を元にアイデアをカタチにするお手伝いをさせていただいております。

Web制作に関するご相談はお気軽にどうぞ

弊社に制作をご依頼いただく際の費用感をご確認いただける、
見積りシミュレーションをご用意いたしました。