カスタマイズ

  graph = AlGraph.new( WIDTH, HEIGHT )
  graph = AlGraph.new( 600, 300 )

  graph.at_graph_area[:stroke_width] = 0

  graph.set_margin(nil, nil, 50, nil)

  graph.x_axis.clear_interval_marks()

  graph.x_axis.labels = [...]

  graph.x_axis.mode_label = :LABEL_NORMAL      # 測定データ配列とラベル配列が1:1で対応
  graph.x_axis.mode_label = :LABEL_INTERVAL    # インターバル線とラベル配列が1:1で対応

  graph.y_axis.max = 200
  graph.y_axis.min = -60
  graph.y_axis.interval = 20

  graph.y_axis.reverse()

  graph.y_axis.logarithmic()

  graph.add_xaxis_title( "xxx" )
  graph.add_yaxis_title( "yyy" )

  graph.add_xaxis_unit( "xxx" )
  graph.add_yaxis_unit( "yyy" )
  graph.add_y2axis_unit( "yyy" )

  graph.y_axis.at_labels[:format] = "%5.2f"

  graph.y_axis.at_labels[:font_size] = 10
  graph.y_axis.at_labels[:font_family] = "sans-serif"
  graph.y_axis.at_labels[:font_weight] = 400
  graph.y_axis.at_labels[:font_style] = "italic"

  graph.y_axis.at_labels[:text_anchor] = "middle"  # start, end, middle

  graph.y_axis.at_labels[:text_decolation] = "underline"

  graph.x_axis.at_labels[:rotate] = 90

  graph.y_axis.at_labels[:renderer] = lambda {|v|
    v.to_s.reverse.gsub( /(\d{3})(?=\d)/, '\1,').reverse    # 数値コンマ３桁区切り表示
  }

  line = graph.add_data_line( ydata )
  line.color = "#012345"      # 色指定
  line.at_marker[:shape] = 'triangle' # マーカーシェープ指定
  line.clear_line             # 線を描画しない
  line.clear_marker           # マーカーを描画しない

  line.at_marker_several[2] = { :shape=>:rectangle, :size=>20 }

  line.id = "ANY-TEXT"

  line = graph.add_data_line(ydata1)
  line.mode_missing_data = :MODE_CONTINUOUS    # 直線補完する（デフォルト）
  line.mode_missing_data = :MODE_BREAK         # 線を途切れさせる

  line.add_data_labels("CENTER")                 # データラベルの表示を指示
  line.at_data_labels[:font_size] = 30           # 表示アトリビュート指示 font_size, stroke, fill等
  line.at_data_labels[:format] = "%.2f"          # 値表示フォーマット
  line.labels = ["Label1","Label2",...]          # 任意ラベル表示の指示（ver3.6以降)

  bar1 = graph.add_data_bar(ydata1)
  bar1.color = 'yellow'

  bar1 = graph.add_data_bar(ydata1, "bar1")
  bar2 = graph.add_data_bar(ydata2, "bar2", bar1)

  graph.at_legend[:y] = 30

  graph.at_legend[:line_spacing] = 20

  graph.at_legend[:font_size] = 15

  graph.color_list = ["#7ec87d", "#6fcadf", "#fb9777", "#e88cb1" ]

注意）個別の色変更は、set_colorメソッドで行うことができる。

  graph.add_text( 100, 150, "文字列" )

  graph.add_aux_tag( "<tag>..." )

  graph.draw                  # 標準出力へ
  str = graph.draw_buffer     # 変数へ

デフォルト動作

CONTENT_TYPE : httpヘッダ "Content-Type: image/svg+xml"を出力する／しない
XML_DECLARATION : XML宣言およびDOCTYPE宣言を出力する／しない

  graph.set_mode( :CONTENT_TYPE )
  graph.set_mode( :NO_CONTENT_TYPE )

出力時に、<?xml…> 行と、<!DOCTYPE svg …> 行を出力するか。

  graph.set_mode( :XML_DECLARATION )
  graph.set_mode( :NO_XML_DECLARATION )

出力時に、<svg…> タグを出力するか。
上記、:NO_XML_DECLARATIONと組み合わせて使うべきでしょう。

  graph.set_mode( :NO_SVGTAG_START )   # SVG開始タグを出力しない
  graph.set_mode( :NO_SVGTAG_END )     # SVG終了タグを出力しない

SVGの属性指定方法と、殆どの場合で同じ指示が使えます。

例

  bar2 = graph.add_data_bar(ydata2, "red")
  bar2.at_bar[:opacity] = '0.8'