rails Open Flash Chart图表(brown_zhang)

open flash chart可以生成很多种类的图表

1.进入http://pullmonkey.com/projects/open_flash_chart2网址，如图下载：

获取： public/javascripts/swfobject.js、 public/ open-flash-chart.swf、vendor/ open_flash_chart文件夹，放在你的项目的对应目录下

2.下面代码是生成曲线图:

class TestItController < ApplicationController

def index

@graph = open_flash_chart_object(600,300,"/test_it/graph_code") ##调用所写好的图片生成文件
end

def graph_code
    title = Title.new("Multiple Lines")     #图表标题
    data1 = []   
    data2 = []
    data3 = []

    10.times do |x|        ##表示横坐标为0到9    
      data1 << rand(5) + 1    ##第一条线，纵坐标值
      data2 << rand(6) + 7    ##第二条线，纵坐标值
      data3 << rand(5) + 14   ##第三条线，纵坐标值
    end

    line_dot = LineDot.new
    line_dot.text = "Line Dot"
    line_dot.width = 4
    line_dot.colour = '#DFC329'
    line_dot.dot_size = 5
    line_dot.values = data1

    line_hollow = LineHollow.new
    line_hollow.text = "Line Hollow"  ##线的名称
    line_hollow.width = 1             ##线的宽度
    line_hollow.colour = '#6363AC'    ##线的颜色
    line_hollow.dot_size = 5          ##线的
    line_hollow.values = data2

    line = Line.new
    line.text = "Line"
    line.width = 1
    line.colour = '#5E4725'
    line.dot_size = 5
    line.values = data3

    y = YAxis.new
    y.set_range(0,20,5)              ##纵坐标显示的值（初始值，结束值，间隔）

    x_legend = XLegend.new("MY X Legend")     ##横坐标单位属性描述
    x_legend.set_style('{font-size: 20px; color: #778877}')

    y_legend = YLegend.new("MY Y Legend")     ##纵坐标属性描述
    y_legend.set_style('{font-size: 20px; color: #770077}') 

    chart =OpenFlashChart.new
    chart.set_title(title)
    chart.set_x_legend(x_legend)
    chart.set_y_legend(y_legend)
    chart.y_axis = y

    chart.add_element(line_dot)
    chart.add_element(line_hollow)
    chart.add_element(line)

    render :text => chart.to_s
  end
end

3.页面代码：

<script type="text/javascript" src="/javascripts/swfobject.js"></script><%= @graph %>

4.运行结果：

 

 

饼图、柱状图等具体见：http://pullmonkey.com/projects/open_flash_chart2/