D3.js

Tree図をいろいろ試してみる~d3.js

投稿日:

 

前提

Rubyでd3.jsのapiリファレンスの一覧を取得してくる~mechanize

これで取得してきたJSONを使っていろいろ試してみた

と言っても、まだ指定のJSONを置き換えただけ

tree.js

cssでフォントの指定を20pxくらいにしてある

さすがに見づらい

tree-radial.js

 

tree-interactive.html

おお、ちょっといい感じかも

コントロールとするには場所とりすぎだし、全体と要素の関係を示すにはもう少し抽象化した(つまり要素を少なくした)方がいいかもしれない

-D3.js
-

執筆者:

関連記事

Rails4とD3.jsでローソク足グラフを描く〜Rails準備編

By: Manuel Calavera – CC BY 2.0 前回 Rails4で複雑な検索〜Ransack こちらのサンプルを使用させてもらいました。 datawarehouse.we …

no image

D3.jsのBarChartをCoffeeScriptでクラス化(仮)

    グラフを描くにはデータセットの数字だけじゃなくて、描画領域の大きさとか幅マージンの値とかいろんな設定が必要なわけで、ただ、データセットの数字とマージンの数字はにんげんにとっ …

Rails4とD3.jsでローソク足グラフを描く〜d3.js編

前回 Rails4とD3.jsでローソク足グラフを描く〜Rails準備編 目次1 jsonデータ2 y_scaleを考える3 始値と終値から箱をつくる4 高値と安値でひげをつくる5 y_axisをつけ …

d3.jsのグラフにマウスオーバーでツールチップをつける

決め打ちで スタイルでフォントサイズを指定した ツールチップがはみ出す場合の条件と処理を追加

 

簡単にグラフが作成できるC3.jsをRailsでつかってみた

By: Nguyen Hung Vu – CC BY 2.0 目次1 C3.js2 gon3 複数の時系列データで一方にはある時点のデータがあるけど他方にはある時点のデータがないみたいな場 …