Shinyで作った確率分布を動かせるページを, NVD3.jsでヌルヌルでインタラクティブなグラフにしました。そしてShinyでD3.jsを使う方法３つ。 - Dimension Planet Adventure 最終章最終話『栄光なる未来』

Shinyで確率分布を学ぶアプリ作った。あるいは、ShinyでD3.jsを使う方法 from ksmzn

今回のブログの内容を、TokyoR#45で発表しました。上は、その時の発表資料です。

先日、Shinyを使った確率分布を動かせるページを作りました。

<a href="http://ksmzn.hatenablog.com/entry/statdist-shiny">Shinyで確率分布を動かして遊べるページ作った - Dimension Planet Adventure 最終章最終話『栄光なる未来』</a>

Shinyで確率分布を動かして遊べるページ作った - Dimension Planet Adventure 最終章最終話『栄光なる未来』

そのときはggplot2を使ってグラフを書いていましたが、それを全てNVD3.jsで作りなおしました！！少し動作に時間がかかるのが難点ですが、ヌルヌル動くインタラクティブな操作ができるようになって、見た目的にちょっと面白いものになっています。

果たしてどれくらいヌルヌルなのか！？
以下のgifをご覧ください！！

f:id:ksmzn:20150114193524g:plain

......あんまりヌルヌルじゃないですが、
これは僕が持っているスクリーンショットアプリのgifがしょぼいだけであり、実際はもっとヌルヌルです！！

↓ 直接アプリでご覧になって、ヌルヌル動かしてください！！

いろいろな確率分布のパラメータをいじくるアプリ @ksmzn #Shiny

ShinyでD3.jsを使う方法。

軽く調べたところ、3つほど方法がありました。

1. rChartsを使う

これがおそらく最もカンタンな方法です。
rChartsはRで手軽にインタラクティブなグラフを描画できるパッケージで、JavaScript の可視化ライブラリを用いています。

rChartsのクイックスタートのページにも ShinyでrChartsを用いる方法が書いてあり、それをカスタマイズするのが最もラクです。

僕も最初はこの方法で書いていたのですが、すごく重くてなかなかグラフが描画されないという問題があり、断念しました。
この方法は、単純なシングルページで使う分には全く問題がないのですが、僕のアプリのようなnavbarPageを使った複数のページにグラフを載せるようなアプリの場合には辛かったです。

とはいえ、ほとんどのパターンではこの方法で良いと思われます。

2. d3Networkを使う

ネットワーク図やデンドログラムなどを描画したい場合は、 d3Networkパッケージを使う方法もあるようです。

ただ、今回の目的には適していないため、僕は試しておりません。
このページ↓を見る限り、なかなか便利そうです。
<a href="http://deta.hateblo.jp/entry/2014/05/13/233700">Shinyでもd3.jsを容易に使えるd3Networkパッケージを試した - でたぁっ感動と失敗の備忘録</a>

Shinyでもd3.jsを容易に使えるd3Networkパッケージを試した - でたぁっ感動と失敗の備忘録

追記 TokyoRの会場で、上記ブログ著者のid:mitsunori さんからnetworkD3というパッケージを教えて頂きました。
名前が似てますが、d3Networkの後継っぽいです。
詳細はid:mitsunori さんの記事をご覧ください

<a href="http://deta.hateblo.jp/entry/2015/01/07/175328">networkD3 - でたぁっ感動と失敗の備忘録</a>

networkD3 - でたぁっ感動と失敗の備忘録