JavaScriptで爆速グラフ・チャートが作成できる「CanvasJS」を使ってみた！ : うえぶはっく
ちょっとしたデータをサクッと「グラフ」や「チャート」にして、Webページに素早く公開したい人に最適なJavaScriptライブラリ「CanvasJS」のご紹介です！ 類似のライブラリはいくつかありますが、「CanvasJS」はわずか数行のコードですぐにグラフが作成でき、なおかつ豊富なパラメータをいじることで驚くほど細かいカスタマイズも実現できるのが特徴的です。 今回は、基本的な使い方を中心にご紹介しようと思います！ 必要なファイルを準備しよう！ 「CanvasJS」の本体ファイルは、サイトのトップページからダウンロードできますが、CDN経由からも利用できるようになっています。 https://cdnjs.cloudflare.com/ajax/libs/canvasjs/1.7.0/canvasjs.min.js これを、HTMLファイルに読み込みます！ // index.html <!d
Eegraph - 美しいグラフが簡単に作成できる！グラフ作成サービス
Step1.タイトルを入力 グラフのタイトルを入力します。管理しやすいようにタグの入力も可能です。作成したグラフは、タイトル、タグからグラフを検索することができます。 Step2.データを入力 グラフデータを入力します。グラフデータはCSV、TSV形式に対応しています。CSV、TSVファイルをアップロードもしくは、エクセルなどのスプレッドシートからデータをコピー＆ペーストでグラフデータを入力できます。 Step3.グラフのテーマと種類を選択 グラフのテーマと種類を選択します。グラフのテーマは、「white」「grid」「dark-blue」「dark-green」「dark-unica」の5テーマ、グラフの種類は、「棒グラフ」4種類、「線グラフ」2種類、「面グラフ」4種類、「円グラフ」3種類、グラフの色は4パターンから選べます。
グラフでウソをつく方法――統計リテラシーのための基礎文献（松谷創一郎） - エキスパート - Yahoo!ニュース
ウソグラフの世界 ここ数年、統計学がブームとなっています。オープンデータやビッグデータなど、IT化の進展とともにそれまで以上にさまざまな数字が扱われるようになっています。 そんな統計において、欠かせないものがグラフです。数値を図形化して視覚的な理解をうながすグラフには、棒グラフ、折れ線グラフ、円グラフなどなど、さまざまな種類があります。 ただ、意図的かどうかはさておき、作為が加えられたグラフを見かけることも珍しくありません。数値に手を加えることはもってのほかですが、それよりも目立つのは見せ方を工夫（作為）して実際の数値以上の効果や影響を錯覚させようとするものです。そうしたものは、「ウソグラフ」あるいは「クソグラフ」などと呼ばれたりします。 それでは、こうしたウソグラフにはどういうものがあるのでしょうか？ 電子コミック市場は急成長？ 先日『News Picks』という新興のネットメディアに、
絶対に描いてはいけないグラフ入りスライド24枚 -slideshare
These slides include many inappropriate graphs. If you want to tell the summary of the data correctly, you should avoid to use graphs in this presentation. They can mislead those who view them. In English, the title of presentaion is "24 slides including graphs that should not be absolutely drawn".Read less
Highcharts - Interactive Charting Library for Developers
Our core library. Includes all standard chart types and more.
NVD3
This project is an attempt to build re-usable charts and chart components for d3.js without taking away the power that d3.js gives you. This is a very young collection of components, with the goal of keeping these components very customizable, staying away from your standard cookie cutter solutions. View more examples » GitHub Repo Download d3.v3.js. This is the only required library for NVD3. Dow
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 右下のチェックマークによって各グラフのオンオフが可能、マウスがグ
インフォグラフィック& オンラインチャートを作成 | infogr.am
Schedule a demoExplore team solutions and boost business efficiency.
分布図（散布図）とバブルチャートの使い方とは？正しいグラフの見方（第7回） | データをざくざく処理するためのグラフの読み方、使い方
「データで表現したいことを、効果的にひと目でわからせるための、グラフの種類の選び方、作り方」を紹介する本連載。これまでに「1つのグラフには1つの主張」という考え方をベースにして、「4つのグラフの使い分けポイント」「円グラフ」「棒グラフ」「折れ線グラフ」「2軸グラフ」の作成ポイントと注意点を順に解説してきました。今回は散布図とバブルチャートをご紹介して、本連載の最終回とします。 項目間・指標間の関係性を見るグラフまず第2回でご紹介したグラフを再掲載します。これはある媒体のバナー広告のインプレッション数とリーチ（累積到達率）を広告素材ごとにプロットしたグラフです。1つの点がそれぞれ1つの広告素材のインプレッション数とリーチを表しています。たとえば、一番右上にある点として表現された広告素材だと、リーチ数が約320万人で約 1.8億インプレッション表示されたということを意味します。このように散布図
rrdtoolは癒し - 桝原翔市の日記
この頃はGraphiteやらInfluxDBがrrdtoolに取って代わられつつあるんでしょうが、rrdtoolのコマンド引数はいじってみると意外と楽しいものです(人によりますが)。このあいだ "rrdtool 誰が一番かっこいいグラフ描けるか選手権"— 桝原翔市 (@shoichimasuhara) April 4, 2014 とか思いつきで言いましたが、とりあえず序の口というか前座というか、とりあえずやって見るだけやってみようと思います MRTG とりあえず書くならこんな感じ MRTGのグラフを彷彿とさせますね。コマンドラインはこちら rrdtool graph shoichi.example.com_loadavg5_1.png \ --title "load average 5 of shoichi.example.com" \ --start end-1w --end now \
Javasciptだけで実現するやたら高機能なグラフ作成ツール『EJSChart』 | 100SHIKI
グラフ作成ツールが人気ですよね。べつやくメソッドも地位を確立しつつあります。 さてそうした流れを受けてご紹介したいのがEJSChart。Javascriptだけで実現できるグラフ作成ツールです。 残念なことにまだ公開前なので全容は不明ですが、やたら高機能らしいです。 ズームやスクロールが可能であるばかりか、マウスイベントを拾ったり、ヒントの表示などもサポートしている模様。ぐっとインタラクティブな表現が可能になりそうですね。 また、グラフの種類も豊富、かつ、XMLによるデータ連携もできるようです。 サイトから推測するに有料かと思われますが、早く試してみたいところですね。
ウェブ上でグラフを作成してブログに貼り付けられる『ChartGizmo』 | 100SHIKI.COM
ブログやサイトにグラフを貼り付けたいときに便利なツールのご紹介。 ChartGizmoではブラウザ上でさくさくグラフを作成し、ブログ貼り付け用のコードを取得することができる。 グラフを作成してくれるシンプルなAPIはいくつか提供されているが、グラフは見た目が重要なだけにじっくりいろいろ設定したいものである。 そう考えると「ブラウザで作成、貼り付け用コードを生成」という流れは正しいのではないだろうか。 データのインポートなども可能なのでグラフを多用したい人にはおすすめのサービスである。
突出したグラフは途中を省略するのがマナーです
「そうなのだ。この日にイベントを仕込んだのだよ。そしたらこんなに客が増えた。これを根拠に別のイベントを客に売り込もうという算段だ」 なるほどね。しかし10月13日があまりにも突出し過ぎていて、他の日の違いがよくわからんな。通常こういう場合、突出した棒の途中を省略するもんだぜ。 「Excelにそんな機能があるのか？」 うーん、残念ながらないね。実際省略しようと思うと手作業で実行しなければならない。ちょっと貸してみな。実際にやってみよう。
jQueryで見栄えのいいグラフが描ける「jqPlot」 (1/3)
証券会社のサイトの株式相場グラフ、ショッピングサイトの価格変動グラフなど、Webサイト上に変動するデータをもとに、動的にグラフを表示したいことがあります。従来は、Flashを使うことが多かったですが、最近はAjax/JavaScript人気もあって、「JavaScriptでグラフも作成したい」というニーズも強くなっています。 以前、本誌では、HTML5のCanvasを使った図形のサンプルとして、グラフの描画方法を紹介しましたが（関連記事）、今回はグラフ描画に特化した専用ライブラリ「jqPlot」を使って、もっと簡単に見栄えのいいグラフを作成する手順を紹介します。 グラフに特化したjQueryプラグイン「jqPlot」 「jqPlot」はクリス・レオネロ氏が開発しているJavaScriptライブラリで、jQueryのプラグインとして動作します。HTML5のCanvasを応用してグラフを描く仕
Wonder Graph Generator
Wonder Graph Generator Value Label Value Label Value Label Value Label Value Label なんらかのバイアス 時空のゆがみ
Pythonを使って簡単にデータを視覚化する
世の中のことをもっと知るにはどうしたら良いだろうと思うときがある。世の中の多くの事柄はログやデータに落とされる。Googleなどの検索サイトは良い例だろう。さて、そのログやデータをどうすれば良いのか? 多くの場合、視覚化が有効な手段となる。 まずは身の回りの日常的なデータやログを何とかしたい。ただ、日常のデータを視覚化するのに数十行以上のコードは書きたくない。まるで息をするかのごとく自然に視覚化を行いたいのだ。そのためには1～2行、長くて数行で済ませることが必要だ。そこでPythonとmatplotlibを使う。加えて、IPythonがあればなお良い。IPythonの導入については以前のブログ記事であるIPythonの埋め込みプロットが素晴らしいを参考にして欲しい。 まずは事前にnumpyとmatplotlibをインポートしておく。できればscipyも。 >>> from numpy im
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Chart.js
https://labs.juiceanalytics.com/chartchooser/index.html
ブラウザ上できれいなグラフがさくっと作れる『ChartGo』 | 100SHIKI
