簡単にグラフが作成できるC3.jsをRailsでつかってみた | | Scimpr Blog
C3.jsはD3.jsをベースにしたグラフ描画のライブラリ. データを与えるだけできれいなグラフが描ける上に、カスタマイズも可能. c3js.org/ 使い方は簡単. 適当にライブラリを配置して読み込む. <%= stylesheet_link_tag 'c3.min', plugin: 'redmine_timetable' %> <%= javascript_include_tag 'lib/d3.min', plugin: 'redmine_timetable' %>
テーブルの内容をリアルタイムにグラフ描画できるjQueryプラグイン「graphTable」:phpspot開発日誌
テーブルの内容をリアルタイムにグラフ描画できるjQueryプラグイン「graphTable」。 このプラグインを使えば、テーブルのデータを読み込んで、リアルタイムにグラフ化してくれます。 $('#table1').graphTable({series: 'columns'}); みたいにすることで、指定したテーブルのデータを次のように描画させることが可能です。 既存の表がある場合は、ブラウザ上でグラフ化することが出来て便利ですね。 以下のエントリを参照してください。 graphTable: graph data from HTML table using flot | jQuery Wisdom 関連エントリ jQueryで実装する進捗グラフ付き複数ファイルアップローダー JavaScript用のグラフ描画ライブラリ色々 CSSだけで円グラフを表示するサンプル
jQuery用データビジュアライズ用プラグイン「jQuery Visualize Plugin」:phpspot開発日誌
jQuery用データビジュアライズ用プラグイン「jQuery Visualize Plugin」 2009年07月09日- jQuery Visualize Plugin: Accessible Charts & Graphs from Table Elements using HTML 5 Canvas | Filament Group, Inc., Boston, MA jQuery用データビジュアライズ用プラグイン「jQuery Visualize Plugin」。 グラフ描画用の仕組みは多数ありますが、jQueryプラグインで簡単＆使いやすい上に、デザイン性もなかなか高いグラフが描画できます。 クリックで編集可能なテーブル表示 デザイン性の高い棒グラフ 同様に、デザイン性の高い線グラフ 円グラフ 色やサイズなんかもオプションで自由に調整可能みたい。 ブラウザ上でのパラメータ調整画面
はてなグラフのデータ Google Chart API の連携 - すちゃらか社員日記
Python, ジョグ | URL にパラメータ文字列をくっつける事で簡単なグラフが作成出来る Google Chart API は手軽で便利ですね。ブログにぺたぺたと貼付ける事が出来るので、一度 URL を生成する仕組みを作っておけば楽しそうです。はてなグラフにジョグや水泳の記録をつけていて、このデータを取得出来るはてなグラフAPIが提供されていたので、 Google Chart API と連携させるスクリプトを書いてみました。 #!/usr/bin/env python # -*- coding: utf-8 -*- """ gchartclient.py Generate Google Chart API URL strings, image file by using pygooglechart from Hatena::Graph data. Require: json-py p
jQueryベースのグラフ作成ライブラリ·jqPlots MOONGIFT
Web上で見やすいグラフを作成する手法としては、画像で生成する、Flashで生成するかのどちらかが多かった。稀にJavaScriptで生成するタイプもあったが、Canvasタグを使う関係上、IE6では表示できず業務アプリなどでの利用は難しかった。 JavaScriptのみでグラフを表示する だが、例えCanvasを使っていたとしてもライブラリが対応していれば問題ない。そこで試したいのがjqPlotsだ。 今回紹介するオープンソース・ソフトウェアはjqPlots、jQueryベースのグラフ描画ライブラリだ。 jqPlotsはCanvasタグを使っているが、対応ブラウザはIE6〜IE8、Firefox、Safari、Operaとなっている。筆者環境では試していないが、IE6でも恐らく大丈夫なのだろう（ぜひ試していただきたい）。これだけ多数のブラウザに対応していれば一般向けWebサービスでも使え
MOONGIFT: » 要チェック！テーブルからグラフを生成するJavaScriptライブラリ「Bluff」:オープンソースを毎日紹介
※ 画像は公式サイトのデモより これは面白い発想だ。Web上でグラフを作成、表示するライブラリは数多く存在する。その際に使う方式としては、基準になる点をXY軸それぞれに対して追加し、描画するという方式だ。これはプログラム言語にとっては簡単な方式かも知れない。 JavaScriptだけで画像グラフを生成する だが、使い慣れている表計算ソフトウェアの場合はどうだろう。はじめに表があり、そこからデータを読み取ってグラフを描くようになっている。その慣れた方式を使えるのがこちらのライブラリだ。 今回紹介するオープンソース・ソフトウェアはBluff、グラフ描画ライブラリだ。 BluffはJavaScriptのライブラリで、画像形式（PNG）のグラフを生成する。棒グラフ、円グラフ、エリアグラフ、折れ線グラフなど様々なグラフ形式をサポートしている。背景色を変えたり、複数のデータを描画できるなど多機能なライ
jQueryベースの滑らかなグラフ描画ライブラリ「Flot」:phpspot開発日誌
Ruminations: Flot 0.1 released! It draws on inspiration from Plotr and PlotKit, and several other commercial packages. But also from venerable old gnuplot - there's nothing more boring than hand-picking axis scales so I wanted the default algorithm to be smart. jQueryベースの滑らかなグラフ描画ライブラリ「Flot」。 Flotを使えば次のようなグラフをJavaScriptで描画することが可能です。 コードは次のように書くみたいです。 <div id="placeholder" style="width:600px;height
Google Chart API にまつわるサービスや各種ライブラリ:phpspot開発日誌
Google Chart API にまつわるサービスやライブラリ。 Google Chart API に関するサービスやライブラリが充実してきたのでまとめてみました。 グラフ作成サービス hohli Online Charts Builder - ウィザードに従ってチャートをリアルタイムに作成可能 Chart Maker - 分かりやすいＵＩにデータを入れるだけで簡単グラフ作成 IE6,Operaでは動かない？ GCFAK 英語じゃないので使えないかも。けどこういうＵＩもなかなか原始的でいいかも。 ライブラリ PHP用 Google Chart API.を超簡単に扱えるラッパークラスライブラリ「gchartphp」が登場 クラスライブラリ GphpChart gchartapiとは別に開発されているクラスライブラリ PHPで「Google Chart API」を扱う ユーティリティ関数
Developer's Guide - Google Chart API - Google Code
Discover the resources for adding interactive charts for browsers and mobile devices.
無償利用可能なFlashのグラフ描画コンポーネント「FusionCharts Free」 - GIGAZINE
商用以外では無料使用できるFlashのグラフ描画コンポーネントで、ASP.NET、ASP、PHP、JSP、ColdFusion、Ruby on Rails、通常のHTMLページ、PowerPointによるプレゼンテーションなどで利用することが可能です。パイチャートや棒グラフ、折れ線グラフなどなど、作成できるグラフの種類も多彩。 実際の具体的な例などは以下から。 FusionCharts Free - Animated Flash Charts & Graphs for ASP, ASP.NET, PHP applications http://www.fusioncharts.com/free/ グラフの例は以下からいろいろと見ることができます。 Chart Gallery Online Demos ダウンロードは以下のフォームに必要事項を記入すれば可能です。 Download なお、製品
ウェブでかっこいいグラフを描くためのライブラリやらテクニックやらのまとめ - IDEA*IDEA ～ 百式管理人のライフハックブログ ～
ドットインストール代表のライフハックブログ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://labs.juiceanalytics.com/chartchooser/index.html
『折線グラフ - JavaScript ライブラリー - HTML5.JP』へのコメント
IDEA * IDEA
サイトでグラフを使いたい時に使えるまとめ - DesignWalker