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
-,

執筆者:

関連記事

連続的な位置情報の取得とHerokuへのアップ~HTML5 Geolocation API

  目次1 連続的な位置情報の取得2 heroku3 結果 連続的な位置情報の取得 連続的な位置情報の取得はこんなかんじで書いてみた [crayon-58d5eaa074cb24404282 …

Rails4.0でもajaxなデータテーブルを使う~ajax-datatables

Railsでajaxなテーブルを使う~datatables Rails4でのJSONテンプレート~jbuilder+rabl+ruby 目次1 index.json.jbuilder2 tasks.j …

Rails3.2でユーザー管理機能を追加~Devise

  前回 Rails3.2のアプリにユーザー機能を追加する~Devise サインアップ機能を削除したので、Railsからのユーザー管理機能を追加した 目次1 generate2 routes …

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

  d3.jsにはlayoutというおおまかに準備されたレイアウトがあって、その中にあるTreeレイアウトを試してみることにした d3.js自身のapiリファレンスが階層構造になっているので …

Rails4でのJSONテンプレート~jbuilder+rabl+ruby

By: Wonderlane – CC BY 2.0[/caption] Rails4からJSONも標準でjbuilderを使ってテンプレートから出力できるようになった けど、しっくり来な …