文書の過去の版を表示しています。

折れ線グラフ

テンプレートファイル

<!DOCTYPE html>
<img src="<%= Alone.make_uri(action:'graph_sample') %>">

コード

main.rb

require "alone"
require "al_graph"
 
class GraphSampleController < AlController
  def action_index()
    AlTemplate.run("index.rhtml")
  end
 
  def action_graph_sample()
    ydata1 = [ 5, 3, 6, 3, 2, 5, 6 ]
 
    graph = AlGraph.new
    graph.add_data_line(ydata1)
    graph.draw
  end
end

まず、AlGraph.newで、グラフオブジェクトを準備します。

折れ線グラフでは、add_data_line() メソッドを使い、引数としてY値の配列を渡します。この例では add_data_line() を一回呼んでいるので、ラインは１本です。

    graph = AlGraph.new
    graph.add_data_line(ydata1)

add_data_line() を２回呼ぶと、ラインが２本描画されます。

    graph.add_data_line(ydata1)
    graph.add_data_line(ydata2)

最後に、draw メソッドで、svg を生成、出力します。

デフォルトでY軸は自動計算され、与えられた値に従って適切な値が選ばれます。

サンプル

リリースファイルでサンプルとして提供しているものです。

X軸ラベルの指定

ラベル類の付与

グリッド線のコントロール

第２Y軸の追加

スケール（軸）を指定（最大、最小、インターバル、上下反転）

プロット線とマーカーを指定