簡単にリッチなチャートが作れるC3.jsを使ってみた - undefined
C3.jsとは? C3.js | D3-based reusable chart library C3 はチャートに特化したビジュアライゼーションライブラリです。D3 のラッパーライブラリで、D3 の見た目の美しさやインタラクション性などの特徴を残しながら、チャートライブラリとして分かりやすいインターフェースを提供するという方針で開発を進めています。 http://blog.xica-inc.com/about-xica/member-12/ これはまではhighchart.jsを使っていましたが、商用利用は有償だったりするので今回C3.jsをいじってみます。 サンプル どんなチャートが作れるか以下のサンプルを見れば分かります。 C3.js | D3-based reusable chart library 使ってみる 音ゲーなどではゲーム終了時にスコアの軌跡がグラフとして描画されたりしま
Highcharts - Interactive Charting Library for Developers
Our core library. Includes all standard chart types and more.
C3.js | D3-based reusable chart library
Comfortable C3 makes it easy to generate D3-based charts by wrapping the code required to construct the entire chart. We don't need to write D3 code any more. Customizable C3 gives some classes to each element when generating, so you can define a custom style by the class and it's possible to extend the structure directly by D3. Controllable C3 provides a variety of APIs and callbacks to access th
インタラクティブな時系列グラフを描くJavaScriptツールキット「Rickshaw」
あらかじめ決めておいたデータやリアルタイムに刻一刻と変化するデータをグラフ化する際に使いやすくできています。しかもグラフ作成の時に迷いがちなカラーリングについても、最初からいくつかきれいなカラーパレットが付属しているので迷うことなくグラフ化できます。 Rickshaw http://shutterstock.github.com/rickshaw/ D3 libraryをベースにし、1721万枚のロイヤリティフリーなストックフォトを有する「Shutterstock」が開発したグラフ用のJavaScriptツールキット・時系列グラフ用フレームワークとなっており、以下のようなグラフ作成が可能です。 通常のグラフ http://shutterstock.github.com/rickshaw/examples/start.html 右下のチェックマークによって各グラフのオンオフが可能、マウスがグ
分布図（散布図）とバブルチャートの使い方とは？正しいグラフの見方（第7回） | データをざくざく処理するためのグラフの読み方、使い方
「データで表現したいことを、効果的にひと目でわからせるための、グラフの種類の選び方、作り方」を紹介する本連載。これまでに「1つのグラフには1つの主張」という考え方をベースにして、「4つのグラフの使い分けポイント」「円グラフ」「棒グラフ」「折れ線グラフ」「2軸グラフ」の作成ポイントと注意点を順に解説してきました。今回は散布図とバブルチャートをご紹介して、本連載の最終回とします。 項目間・指標間の関係性を見るグラフまず第2回でご紹介したグラフを再掲載します。これはある媒体のバナー広告のインプレッション数とリーチ（累積到達率）を広告素材ごとにプロットしたグラフです。1つの点がそれぞれ1つの広告素材のインプレッション数とリーチを表しています。たとえば、一番右上にある点として表現された広告素材だと、リーチ数が約320万人で約 1.8億インプレッション表示されたということを意味します。このように散布図
ブログなどに埋め込みできるグラフ作成ツール「Google Image Chart Editor」 | ライフハッカー・ジャパン
モバイルバッテリーとは呼べない。「ほぼポタ電」なコレ1台で有事の時もアウトドアも大活躍!【AmazonスマイルSALE】
データを分かりやすくスタイリッシュに可視化できるJavascriptライブラリ「D3.js」
どんなに情報をまとめても、それを可視化して見ている人にうまく伝えるのは至難の技です。そんな時にデータをスタイリッシュかつ見やすいグラフにしてくれるのが、様々なデザインのJavascriptがダウンロード可能なライブラリ「D3.js」です。 D3.js - Data-Driven Documents http://d3js.org/ D3.jsを使って作ったグラフの事例を公式ギャラリーから見ることが可能で、これらのグラフにもとになる素材(スクリプトのソース)がGitHubで入手可能です。 Gallery · mbostock/d3 Wiki · GitHub デザインの一例は以下から。 ◆:Bubble Chart 作成例によっては、ページに直接コードが記載されているものもあります。 ◆:Four Ways to Slice Obama’s 2013 Budget Proposal - In
新感覚フォント。数字と足し算からグラフを生成「FF Chartwell」 | ビジュアルシンキング
変わったフォント「FF Chartwell」を紹介します。 数字と足し算からグラフを生成できます。 AdobeのIllustrator、InDesign、Photoshopで使えるようで（参考）、フォントとして「FF Chartwell」を選び、テキストに足し算を打ち込んで変換をかけるとグラフになります。 グラフ生成手順は言葉で書くよりも、プロモーション・ムービーを見た方がわかりやすいと思います。 使う文字は、数字と足し算だけのようですね。 美しいグラフが簡単に描けそうです。 「FF Chartwell」フォントは全部で7種類あり、それぞれ対応するグラフが異なります。 フォント・レーベル「FontFont」がこちらで販売しています（1種類 $25）。
Javascriptで扱えるカッコイイグラフのまとめ - Qiita
結論:Highchart ccchart(canvasChart)と悩みましたが、Highchartを選んだ理由は、下記の通りです。 1.円グラフや棒グラフを組み合わせた複合的なグラフのサンプルを載せている 2.複合グラフのアニメーションがかっこいい 商用ライセンスなので、無料にこだわる方は、ccchart(canvasChart)がおすすめです。 Highchart 表現力、完成度の点でいちばんだと思います。商用なのでお金さえあればこれがイチオシ。 ccchart(canvasChart) 私のイチオシは canvasChart です ライセンスは PUBLIC DOMAIN! raphael.js qiitaのプロフィールの円グラフで使われているjQueryプラグイン 美しめなグラフを作成することができる。 raphael.jsのプラグインのelycharts.js http://el
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Chart.js
Juice Labs - Chart Chooser