====== カスタマイズ ====== ==== グラフサイズ指定 ==== graph = AlGraph.new( WIDTH, HEIGHT ) graph = AlGraph.new( 600, 300 ) ==== グラフ全体を囲む枠線を消す ==== graph.at_graph_area[:stroke_width] = 0 ==== マージンの指示 ==== graph.set_margin(nil, nil, 50, nil) ===== 目盛軸(AXIS)関連 ===== ==== X軸目盛にインターバル線を表示しない ==== graph.x_axis.clear_interval_marks() ==== X軸目盛ラベル指定 ==== graph.x_axis.labels = [...] ==== X軸目盛ラベルモード (ver3.6以降) ==== graph.x_axis.mode_label = :LABEL_NORMAL # 測定データ配列とラベル配列が1:1で対応 graph.x_axis.mode_label = :LABEL_INTERVAL # インターバル線とラベル配列が1:1で対応 ==== Y軸最大、最小、メモリ幅の指示 ==== graph.y_axis.max = 200 graph.y_axis.min = -60 graph.y_axis.interval = 20 ==== Y軸反転 ==== graph.y_axis.reverse() ==== Y軸をログ軸にする(対数グラフ) ==== 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 # 数値コンマ3桁区切り表示 } ===== 折れ線関連 ===== ==== 折れ線表示属性の指示 ==== 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 } ==== 折れ線への任意ID付与 ==== line.id = "ANY-TEXT" ==== データ欠損時の線のひき方 (ver3.6以降) ==== 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) ===== 凡例(Legend)関連 ===== ==== 位置の調整 ==== 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, "文字列" ) ==== 任意SVGタグの追加 ==== graph.add_aux_tag( "..." ) ===== 出力関連 ===== ==== SVG出力先の変更 ==== graph.draw # 標準出力へ str = graph.draw_buffer # 変数へ ==== 出力モードの変更 ==== デフォルト動作 ^ ^ CONTENT_TYPE ^ XML_DECLARATION ^ | draw | O | O | | draw_buffer | x | x | CONTENT_TYPE : httpヘッダ "Content-Type: image/svg+xml"を出力する/しない \\ XML_DECLARATION : XML宣言およびDOCTYPE宣言を出力する/しない ==== httpヘッダ "Content-Type: image/svg+xml"を出力する/しない ==== graph.set_mode( :CONTENT_TYPE ) graph.set_mode( :NO_CONTENT_TYPE ) ==== XML宣言およびDOCTYPE宣言を出力する/しない ==== 出力時に、 行と、 行を出力するか。 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'