Rails のチャート

私たちは、グラフが千の言葉に匹敵するサーバー データを扱うプロジェクトに取り組んでいます。私にはいつもさまざまなチャートのリクエストがあり、過去には Gruff を使用してチャートを作成したことがあります。 不機嫌そうな は素晴らしいライブラリであり、結果も良好です。ただし、最近では、チャート上でより動的な動作を提供するために、より厳しい要件が求められるようになりました。ユーザーは、さまざまな方法でチャートを操作し、ドリルダウンしてより多くの情報を収集できるようにしたいと考えていました。

私は Gruff の代替品を検討し、これを使用することに決めました。 XML/SWF チャート。これらのフレームワークはチャートに Flash レンダリングを使用し、優れた機能、24 時間対応のサポートを備え、安価です。もう 1 つの利点は、クライアントのサーバーに RMagick をインストールするためのさまざまな呪文を理解する必要がなくなったことです。さらに、実際のチャートのレンダリングをクライアントに委任することができました。これは動的グラフでは重要です。サーバー側で行うべきことは、XML (リアルタイムの CPU 使用率) を生成することだけでした。

この記事では、Gruff、Google チャート、Ziya チャート、Open Flash チャート、Fusion チャートなど、レールで利用できるさまざまなチャートについて少し説明したいと思います。

現在使用しています Flash チャートを開く 現在のプロジェクトの場合。

不機嫌なチャート:
Gruff は、魅力的で強力なグラフを生成するための Ruby ライブラリで、Web アプリケーションや印刷メディアなどに役立ちます。

スナップショットのレンダリング

Gruff グラフは何度でもレンダリングでき、レンダリングの合間に設定を変更できます。次のレンダリングでは、データ、色、さらにはグラフ サイズや画像タイプもすべて変更できます。

簡単に拡張可能

Gruff は非常に拡張性が高いように設計されています。新しいグラフの種類やテーマの追加は、わずか数行のコードで行うことができます。グラフをさらに細かく制御する必要がある場合は、レイアウト、データ生成など、ほぼすべてをカスタマイズできます。

インストール

sudo gem install gruff

使用方法のデモンストレーション

円グラフの例

「rubygems」が必要です

「不機嫌」が必要

g = Gruff::Line.new

g.title = “私のグラフ”

g.data(“リンゴ”, [1, 2, 3, 4, 4, 3])

g.data(“オレンジ”, [4, 8, 7, 9, 8, 9])

g.data(“スイカ”, [2, 3, 1, 5, 6, 8])

g.data(“桃”, [9, 9, 10, 8, 7, 9])

g.labels = {0 => '2003'、2 => '2004'、4 => '2005'}

g.write('my_fruity_graph.png')

Google チャート:

Google Chart API は、URL に応答して PNG 形式の画像を返します。折れ線グラフ、棒グラフ、円グラフなど、いくつかのタイプの画像を生成できます。画像タイプごとに、サイズ、色、ラベルなどの属性を指定できます。

インストール Ruby スクリプト/プラグインのインストール https://google-charts-on-rails.googlecode.com/svn/google_charts_on_rails/

インストールしたら、プロジェクトで直接使用を開始します。

円グラフの例

GoogleChart.pie(10,20,40,30).to_url

ラベル付き:

GoogleChart.pie(['1997',10],['1998',20],['1999',40],['2000',30]).to_url

ジヤチャート:

Ziya allows you to easily create interactive charts, gauges and maps for your web applications. Ziya leverages flash which offloads heavy server side processing to the client. At the root, Ziya allows you to easily generate an XML files that will be downloaded  for rendering. Using this gem, you will be able to  create great looking charts for your application easily.

特徴 ：
-Supports a wide variety of chart/gauge types.
-Geographical maps.
-Relieves your server load by generating the actual chart on the client side.
-Themes support. You can change the appearance and behavior of any charts by introducing new themes.

インストール:
> gem sources -a //gems.github.com
> sudo gem install derailed-ziya

cd to your application directory and issue the following command:
> ziyafy –charts
This will copy the necessary themes and flash files to run ZiYa in your application’s public/charts directory. You can install maps and gauges components as well. Type in:

> ziyafy –help
To see all available options.

フラッシュチャートを開く:

特徴 :
-More dynamic graphs with eye catching tooltips and legends for readability.
-Various types of charts available, except real time charts.
-Simple and easy to install the plug-in. Does not need and gem like Rmagick or ImageMagick.
-Data is rendered and displayed in SWF format.
To install and use the open flash chart plug-in for Rails do the following:

1.script/plugin install //svn.pullmonkey.com/plugins/trunk/open_flash_chart/
2.Move the open_flash_chart.swf file into your RAILS_ROOT/public directory
3.Move the swfobject.js file into your RAILS_ROOT/public/javascripts directory
4.Create a controller and a view as in my examples below.

実装：
def index_stacked_bar
@graph = open_flash_chart_object(600,300,”/test_it/graph_code_stacked_bar”)
終わり

def graph_code_stacked_bar
title = Title.new(“A stacked bar chart”)
title.set_style( “{font-size: 20px; color: #F24062; text-align: center;}” );
bar_stack = BarStack.new
bsv1 = BarStackValue.new(2.5, ‘#C4D318’) # yellow
bsv2 = BarStackValue.new(5, ‘#50284A’) # purple
bsv3 = BarStackValue.new(1.25, ‘#7D7B6A’) # gray
bsv31 = BarStackValue.new(1.25, ‘#C4D318’) # yellow
bar_stack.append_stack( Array.new( [bsv1, bsv2, bsv1 ]) ); # 0
bar_stack.append_stack( Array.new( [bsv1, bsv2, bsv3,bsv31 ]) ); # 0
bar_stack.set_tooltip( ‘X label [#x_label#], Value [#val#]<br>Total [#total#]’ );
y = YAxis.new();
y.set_range( 0, 14, 2 );

x = XAxis.new();
x.set_labels_from_array( Array.new( [‘Winter’, ‘Spring’, ‘Summer’, ‘Autmn’ ]) );
tooltip = Tooltip.new;
tooltip.set_hover();
chart = OpenFlashChart.new
chart.set_title(title)
chart.add_element(bar_stack)
chart.x_axis = x ;
chart.y_axis = y ;
chart.set_tooltip( tooltip );
render :text => chart.to_s
終わり

融合チャート:

Fusion Charts は、インタラクティブなアニメーション チャートを生成できる Flash ベースのチャート コンポーネントです。 Fusion Chart は任意の Web スクリプト言語で使用でき、最小限のコーディングで強力なチャートを提供できます。 Fusion Charts には、以下で使用するためのラッパー モジュールが付属しています。 ルビー・オン・レール

Fusion Charts offers over 45 types of 2D/3D charts including line, area, bar, column, pie, doughnut (donut), combination, scatter, bubble, scroll charts etc. The functional and cosmetic aspects of each chart can be extensively customized using the XML API used by Fusion Charts.
Generating charts using Fusion Charts in Ruby on Rails through a sample application. To run the sample application, the following would be needed:
• FusionCharts Free/ v3:
Fusion Charts Free can be downloaded by clicking ここ

または、より多くのオプションを備えた商用バージョンは、から直接ダウンロードできます。 www.fusioncharts.com .

Installation of Fusion Charts involves just copying and pasting the SWF and .rb files from the download package into appropriate application folder. The .rb files are present in Download Package > Code > RoR > Libraries folder.
• Ruby 1.8.6 or above
• Rails gem 2.0.2 or above:
• MySQL 4.0 or above

上記で説明したすべてのチャートには、それぞれ長所と短所があります。これらを使用する最適な方法は、プロジェクトの要件の種類によって異なります。この記事が、Rails で使用できるチャートを最大限に活用するのに役立つことを願っています。

ご連絡ください。 

保存