D3.js Railsで使えるGem

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

投稿日:

前回

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

jsonデータ

こんなかんじで

 

y_scaleを考える

最安値と最高値をとって、そのあいだにする

 

始値と終値から箱をつくる

 

高値と安値でひげをつくる

 

y_axisをつける

 

x_scaleを考える

これが今回のハマりどころ

time.scaleを定義するときに、domainは[Dateオブジェクト、Dateオブジェクト]にしておかないとダメ そうしないとNaNが返ってくる

あとtime_scale(date)で使う時もdateはDateオブジェクトじゃないとNaNが返ってくる

 

x_axisをつける

 

もろもろ調整してできた

screenshot

 

-D3.js, Railsで使えるGem
-,

執筆者:

関連記事

RailsでこんにちはBackbone.Marionette

By: palindrome6996 – CC BY 2.0 自分の中でmarionette熱がだんだんと高まりつつあり、特徴的なItemView、CollectionView、Compo …

Railsでjavascriptやcoffeescriptをつかうとき便利かもしれないGem

By: Stan Dalone & Miran Rijavec – CC BY 2.0 目次1 oj2 gon3 js-routes4 rails-dev-tweaks oj gi …

RubyでWikiをはじめる〜gollum

目次1 環境2 インストール3  ハロー Gollum4 Powでつかう5 情報 環境 Ruby 2.1.0 Mac OSX Mavericks インストール 自分の環境ではこれをいれとかないとインス …

no image

Ubuntu Server 12.04で動画のサムネイルを作成~avconv ffmpeg

  目次1 インストール2 動画の情報3 使えるフォーマットの一覧4 サムネイル画像の作成 インストール

総合的な動画の変換 …

no image

Rails3.2でテーブルの並び替えをリファクタリング~ヘルパー

環境 Rails3.2.8でテーブル並び替えのテストを作る~cucumberと正規表現 テストができたのでHelper化 目次1 現状2 helper3 index.html.erb 現状 共通部分が …