CodeZine(コードジン)

特集ページ一覧

Ruby on Rails + Curl
Railsの表示にCurlを使ってRIAを構築する

  • ブックマーク
  • LINEで送る
  • このエントリーをはてなブックマークに追加
2009/05/21 14:00

目次

Curlを使い3Dグラフを表示

 それでは、Scaffoldのコードを改造してみましょう。いよいよCurlの登場です。ここでは下の画面のようなCurlの華麗な3Dグラフを使い、選手の成績を表示できるようにしてみましょう。

1. 準備

 Curlを実行する為の実行環境Curl RTE、開発ツールCurl IDEをダウンロードしインストールして下さい。また、今回使う3D棒グラフもダウンロードします。

2. コードの変更

 Scaffoldの生成したコードの一部を変更します。

app/controller/players_controller.rb
class PlayersController < ApplicationController

  def chart
    @players = Player.all
    render :layout => false, :content_type => 'text/vnd.curl'
  end

  # 以下はそのまま
end

 グラフを表示する chart メソッドを追加します。コードは index に同じように全選手のデータを取得し、グラフ表示用のテンプレートでCurlのコードを組み立て出力します。

 Curlのコードをブラウザ上で実行するために ContentTypeをtext/htmlではなく text/vnd.curl に指定しています。またデフォルトのレイアウトファイルが付かないように :layout を false にします。

config/route.rb
ActionController::Routing::Routes.draw do |map|
  map.resources :players
     ↓ のように変更
  map.resources :players, :collection => { :chart => :get }

  ・・・省略・・・

 追加した chartメソッドが動作するように、URLとControllerの対応を記述した route.rb の定義に chartメソッドを追加します。

app/views/players/index.html.erb
  ・・・省略・・・
<br />

<%= link_to 'New player', new_player_path %>
| <%= link_to 'Chart', chart_players_path %>      ← この行を追加 

 一覧ページにグラフ表示ページへのリンクを追加します。b.のようにroute.rbを変更すると グラフ表示ページのパスが取得できるメソッド chart_players_path が動的に作成されます。

app/view/players/chart.html.erb
{curl 6.0 applet}

{import * from COM.CURL.CSK.EXTRAS.BAR-CHART-3D,
    location = "/curls/bar-chart-3d/load.scurl"
}

{let bar-chart-graphic:#BarChartGraphic}

{do
    || Create an array of values
    let values:{Array-2-of double} = {new {Array-2-of double}, 2, <%=@players.size%>}
<% @players.each_with_index do |player, ix| %>
    set values[0, <%=ix%>] = <%=player.goal%>
    set values[1, <%=ix%>] = <%=player.assist%>
<% end %>
    let x-labels:{Array-of String} =
        {new {Array-of String}, "Goal", "Assist"}
    let y-labels:{Array-of String} =
        {new {Array-of String},
         <%= @players.map {|player|  '"' + player.name + '"'}.join(",") %>
        }

    || Create a bar chart with these values
    let bar-chart:BarChart =
        {BarChart values, x-axis-labels = x-labels, y-axis-labels = y-labels,
         length=3in, width=3in, height=3in, x-margin=0.5}

    set bar-chart-graphic =
        {BarChartGraphic
            bar-chart,
            width=8in,
            height=8in
        }

}

{value bar-chart-graphic}

 Curlの3Dグラフを表示するためのテンプレートを追加します。このコードは 3D棒グラフのサンプルを元に作りました。変更したのは、「3D棒グラフに渡すデータを作成する部分」「表示サイズの変更」と極わずかです。

public ディレクトリ
public
|-- 404.html
|-- 422.html
|-- 500.html
|-- curl-access.txt            ← 追加
|-- curl-license-5.dat         ← 追加
|-- curls                      ← 追加
|   `-- bar-chart-3d
|       |-- Bar.scurl
|       |-- BarChart.scurl
|       |-- BarChartGraphic.scurl
|       |-- GraphWall.scurl
|       |-- ex-3d-bar-chart.curl
|       `-- load.scurl
|
  ・・・省略・・・

 Ruby on Railsでは画像やCSSなど静的なコンテンツはpublicディレクトリに置きます。そこでダウンロードした bar-chart-3d は curl用ディレクトリを作り、その下に置きます。また、ライセンスファイル curl-license-5.datと アクセス許可ファイル curl-access.txt を publicディレクトリに置きます。

3. 実行

 ここでは route.rbを変更しましたのでサーバーを再起動します。一覧ページをアクセスし Chart リンクをクリックしてみてください。3Dグラフが表示されたはずです。

まとめ

 今回はRuby on Railsの概要と使い方、Curlとの連携について説明いたしました。 Ruby on Railsを使う事でCurl用のサーバーサイド構築が素早く行える事を感じて頂ければ幸いです。



  • ブックマーク
  • LINEで送る
  • このエントリーをはてなブックマークに追加

著者プロフィール

  • 吉田裕美(ヨシダユウミ)

    有限会社 EY-Office 取締役 CADのベンチャー企業でCADのコア部分や図面管理システムなどの開発に従事した後、独立しJava,Ruby,PerlでWebアプリを中心に開発してきた。現在は殆どの開発はRuby on Rails。 ここ数年はソフトウェアエンジニアの教育に興味をもち、従来の...

バックナンバー

連載:Ruby on Rails + Curl
All contents copyright © 2005-2020 Shoeisha Co., Ltd. All rights reserved. ver.1.5