Curlを使い3Dグラフを表示
それでは、Scaffoldのコードを改造してみましょう。いよいよCurlの登場です。ここでは下の画面のようなCurlの華麗な3Dグラフを使い、選手の成績を表示できるようにしてみましょう。
1. 準備
Curlを実行する為の実行環境Curl RTE、開発ツールCurl IDEをダウンロードしインストールして下さい。また、今回使う３Ｄ棒グラフもダウンロードします。
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グラフを表示するためのテンプレートを追加します。このコードは ３Ｄ棒グラフのサンプルを元に作りました。変更したのは、「３Ｄ棒グラフに渡すデータを作成する部分」「表示サイズの変更」と極わずかです。
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ディレクトリに置きます。
- curl-license-5.dat は Curl IDEディレクトリ内 C:¥Program Files¥Curl Corporation¥Surge¥7¥ide¥etc¥localhost¥curl-license-5.dat からコピーします。
- curl-access.txt については、カール - FAQ（セキュリティ）：OpaqueSecurityExceptionというセキュリティーエラーが出ます。なぜでしょうか？を参考に作ってください。
3. 実行
ここでは route.rbを変更しましたのでサーバーを再起動します。一覧ページをアクセスし Chart リンクをクリックしてみてください。3Dグラフが表示されたはずです。
まとめ
今回はRuby on Railsの概要と使い方、Curlとの連携について説明いたしました。 Ruby on Railsを使う事でCurl用のサーバーサイド構築が素早く行える事を感じて頂ければ幸いです。
