Jupyter-notebook の作図ライブラリ比較 - Qiita
時は戦国 Python には作図ライブラリがたくさんあります。 最もデファクトスタンダードに近く歴史も古い作図ライブラリは matplotlib で間違いないでしょうが、それでも R における ggplot2 ほどの地位は確立していないように思います。 特に、Jupyter-notebook 上ではインタラクティブなグラフを表示するニーズがあり、そこでは静的なグラフよりもさらにライブラリが割拠している印象があります。何がどう違うのかよくわかりません。 そこで今回は代表的な作図ライブラリの Jupyter-notebook 上での 違いについて簡単にまとめます。 注意 各ライブラリはいずれも細かくグラフのスタイルを設定可能で、やろうと思えば同じような見た目のグラフを生成することも可能ですが、今回はできるだけ何も設定せずにプロットした時のグラフを使います。 今回試すライブラリたち matplo
Vue.js+d3.jsで折れ線グラフを描く - Qiita
Vue.js Advent Calendar 2016 11日目 まえがき Vue.jsと描画機能とd3.jsの計算機能を合わせて折れ線グラフを描いてみます。 d3.jsで直接描画してもいいのですが、せっかくなのでVue.jsで宣言的に描けたらな、と。 デモ デモ(jsfiddle) コード メインのコンポーネント <svg :width="width" :height="height" :viewBox="viewBox"> <my-line v-for="(line,index) in lines" :x-scale="xScale" :y-scale="yScale" :parameters="line" :index="index"></my-line> <horizontal-grid v-for="y in yTicks" :x-scale="xScale" :y-scale=
グラフカーネルのメモ
Weisfeiler-Lehmanグラフカーネルについてのメモである．特に冒頭のグラフカーネルを俯瞰したイントロあたりを読んで面白かったので力尽きるまで読んだ．あと書いている人はカーネル法の研究者でもなければ，グラフに関した機械学習の研究者でもありませんので，気軽に読んでくださいね(これはいわゆる，マクドナルドで女子高生がXXメソッド)． N. Shervashidze et al., Weisfeiler-Lehman Graph Kernels, JMLR, vol. 12, pp. 2539-2561, 2011. お約束: Preliminary ラベル付きグラフG=(V, E, l)，ラベルは自然数とする． N(v)でvの近傍を表す． Walk: edgeの列で，Path: 異なる節点を通るようなWalk（たぶん） 部分木: サイクルを含まない部分グラフ 部分木パターン: 同じ節
KDD'16 論文採択：省メモリなグラフスケッチのデータ構造 - iwiwiの日記
国際学会 KDD 2016 に論文が採択されました．KDD はデータマイニング分野の最も有名な会議です．発表は 8 月にサンフランシスコです．オーラル発表有りの採択です． 今回の論文は "Compact and Scalable Graph Neighborhood Sketching" というタイトルで，私が主著であり，研究室で特任技術専門員としてお手伝いしてもらっていた矢野さんとの共著です．内容はグラフ向けデータ構造 All-Distances Sketches の実用上の問題点である空間使用量を大幅に削減するための新しいデータ構造の提案です．以前に「大規模グラフのコンパクトでスケーラブルな全距離スケッチ」というタイトルで人工知能学会の人工知能基本問題研究会にて議論させて頂いていたものです． 背景：All-Distances Sketches とは？ All-Distances Ske
Chart.jsで折れ線グラフをリアルタイムにウネウネ動かした。 - Qiita
chart.jsのグラフを動かしたい センサー値とかを収集していい感じにリアルタイムに動かして表示したいなーと思ってChart.jsのLineChartを弄ってみて、なんとかウネウネ動かすとこまで行ったのでまとめ。 できたもの やりたかったことは常時一定の測定点をもつ折れ線グラフを右から左へ流していくイメージ。 https://jsfiddle.net/yac0L4gq/2/ （初期化以外は）適当に乱数値でグラフ書いてます。 すでに存在する点の値を次々ずらして更新していくことで動きを作っている。 失敗したこと すでに存在する点をシフトしていくと左からなくなる予定の測定点がアニメーションして右側に移動する、持ってるデータにどこの点の測定点かなどのデータも持ってる、などイマイチな挙動やデータの状態になるのでこの方針は諦めた。 感想 ウネウネ動かしてるとすごい勢いでCPUのファンが回ってしまう、
Chart.jsを使って「動的に」グラフをアニメーションさせる方法 - ウィリアムのいたずらの、まちあるき、たべあるき
ウィリアムのいたずらが、街歩き、食べ物、音楽等の個人的見解を主に書くブログです（たま～にコンピューター関係も） Javascriptでグラフを書く場合、Chart.jsを使うことが多いと思う。 ただ、Chart.jsは、 Canvasで超可愛いグラフが作れる!「Chart.js」の紹介 http://liginc.co.jp/web/js/40934 にあるように、多くのサンプルは、グラフを１回書くだけで、 Ajaxとか使って、動的にグラフを描いていく（アニメーションさせる） 方法を書いてないよね。 例えばこんな感じ http://www.geocities.jp/xmldtp/js_chart1.htm （ちょっと経つと、点が追加されていく。 下のボタンをクリックすると、少し経ってから とまる（すぐにはとまらない）。 とまっているときにクリックすると、動き出す）。 なので、今日は、そこを
Chart.jsとAngular JSを組み合わせて動的なグラフを生成してみる
前回に引き続き、Chart.jsのTipsです。 Chart.jsを使いグラフを表示してみる 今回はAngular.jsとChart.jsを組み合わせて、動的に値が変化するグラフを作ります。 Angular.jsの基本的な使い方は割愛します。 ちなみに今回使用するバージョンは下記のとおりです。 Angular JS v1.4.9 Chart.js v1.0.2 Angular.jsでフォームをバインドする まずはangular.min.jsを下記サイトよりダウンロードしてきましょう。 Angular JS CDNにも公開されていますが、セキュリティ面で外部ソースを引っ張るのはあまり良くないとのことですのでダウンロード版を使いましょう。 (今回のデモを作る程度でしたら、CDNでも問題ありません。) コントローラー&フォームバインドの簡単なコードが下記です。 <!DOCTYPE html> <
chart.js入門 - Qiita
グラフ（折れ線グラフ、棒グラフ、レーダチャートなど）描画用のライブラリ。 ※単にグラフを書きたいだけの人はD3.jsより簡単なのでお勧め。 ファイルダウンロード先/公式ドキュメント ダウンロード先：http://www.chartjs.org ドキュメント：http://www.chartjs.org/docs 使い方 canvasを用意して、Chart.jsへグラフの情報（lineChartData）とグラフ全体のオプション（option）を渡して描画する。 下記の例は折れ線グラフ。ChartオブジェクトのBarメソッドを実行すれば棒グラフになるし、Radarメソッドを実行すればレーダーチャートになる。 <!--ライブラリ読み込み --> <script src="js/Chart.min.js"></script> <!--描画箇所 --> <canvas id="lineChartC
JavaScriptでグラフ描画入門！全８個のライブラリをコード付きで一挙に解説！ - paiza times
どうも、まさとらん（@0310lan）です。 今回は、JavaScriptを使って「グラフやチャートを描きたい！」とか、「さまざまなデータを可視化させたい！」という人にオススメのJSライブラリをご紹介しようと思います。 また、すぐに使い始められるように、ミニマムな構成の「サンプルコード」も合わせて掲載しているので、自分に合ったライブラリを使う取っ掛かりになれば幸いです。 ■Chart.js 【Chart.js】 最近、活発にバージョンアップをしている「Chart.js」は、すべてのグラフが自動的にアニメーション表示されるユニークな仕掛けを持っており、シンプルで理解しやすい記述が出来る点も魅力です。 グラフの種類は少ないものの、モダンブラウザ＆レスポンシブ対応で、あまりカスタマイズせずに「デフォルト」のままでも手軽に使えるでしょう。 【 基本の書き方 】 「chart.js」ファイルは、公式
【勉強会資料公開】グラフ勉強会 - DMM.comラボエンジニアブログ
こんにちは、DMM.comラボ技術広報です。 今回は2016/3/8に開催された DMM.Study Night "グラフ勉強会"で発表された資料を公開いたします。 ■Spark graph framesとopencypherによる分散グラフ処理の最新動向 Spark graph framesとopencypherによる分散グラフ処理の最新動向 from knagato www.slideshare.net DMM.comラボの加嵜がグラフ処理の動向に関して話ました！ ■Oracle Labs 発！ Parallel Graph Analytics（PGX） Oracle Labs 発！ Parallel Graph Analytics（PGX） from oracle4engineer www.slideshare.net 日本オラクルの山中さんに話していただきました！ 今後もDMMでは
TransE [NIPS'13] を実装（と実験再現）した - でかいチーズをベーグルする
Graph embedding を調べる上で避けては通れないっぽいTransEを実装して実験再現してみた。モデルがシンプルでカッコイイし実装も簡単だった。データもパラメータも公開されてて実験を再現できたのもポイント高い。 TransE NIPS'13で提案されたGraph embeddingをする手法。Google scholarで既に100以上引用されていろんな拡張モデルが提案されてる。論文は以下。 papers.nips.cc TransEはKnowledge graph（Freebaseとか）をベクトル空間上にembeddingする。入力としてKnowledge graphを与えると、全てのsubject, predicate, objectに対してそれぞれk次元のベクトルを出力する。ポイントは出力されたベクトル空間に構造があること。例えば、 v(Kei Nishikori) + v
D3.jsのForce Layout (力学モデルでグラフ描画するレイアウト)を動かしてみた - カタカタブログ
D3.jsのForce Layout (力学モデルでグラフ描画するレイアウト)を動かしてみた D3.jsというJavaScriptでデータをきれいに可視化するライブラリに、グラフ(棒グラフとか折れ線グラフではなく、グラフ理論のグラフ。ネットワークと同義)をきれいに描画する機能があったので、試してみた。 公式サイト: https://github.com/mbostock/d3/wiki/Force-Layout ネットで検索するともっときれいなサンプルはたくさんあるのだが。。とりあえず、htmlファイル1つだけで動作確認できる最小の構成で作ってみた。以下のソースをコピーしてindex.htmlとかに保存し、ブラウザで開くだけでグラフが描画される。 データはノードとリンクをハッシュの配列として用意するだけで、あとは以下のようなほぼお決まりのコードでレンダリングできる。 簡単なサンプルを作成す
TOURISTIC:バネモデルによるグラフ描画をJavaScriptで
2007年05月17日23:34 バネモデルによるグラフ描画をJavaScriptで カテゴリIT バネモデルによるグラブ描画をするJavaScriptライブラリを書きました。 サンプルはこちら http://sawamuland.com/graph/sample.html バネモデルの基本は２つのノード(点)がつながれている場合、そこにバネがあるとして力(内向きまたは外向き)を計算し、 さらに自分とつながっていない全てのノードから距離に応じた斥力(反発する力)を受けるとして位置の移動を繰り返します。 つまり、つながれた２点が近すぎる場合は反発し、遠い場合は引き合い、つながれてない他の点からは等しくはなれようとするため多くのエッジ(線)を持つ集合が固まり、線が少ないノードはそこから離れて行きます。 この実装ではバネの力は log( ノード距離 / バネの長さ ) に適当な係数をかけて計算し
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
spark(graphx)で動作する分散グラフ分析器 sotera-DGAを動作させる - Qiita
Chart.js/samples/timeScale/line-time-point-data.html at 965a71f0c092c98591e5e02930121523acb9ac49 · chartjs/Chart.js
LNLY » Chart.jsを使ってiPhoneにかかる加速度を視覚化する[1/3]
Edit fiddle - JSFiddle - Code Playground
今日からわかる！ソーシャルグラフ解析
Charming Python: Functional programming in Python, Part 3
てくらのぺぇじ