懒惰高图:无法显示饼图

时间:2012-07-25 16:48:23

标签: ruby-on-rails ruby ruby-on-rails-3 lazy-high-charts

按照说明here(并更正代码示例中的代码问题),我试图在我的应用中实现饼图。我加载了初始页面,但饼图没有加载到部分(我把它放到html.erb文件中)。很多东西现在都是硬编码的,所以例如Chart Type等不会传回控制器。

有人可以帮我指出我出错的地方吗?

控制器:

  def dynamic_chart
    @chart_types = ChartType.all
    @user_visible_models = ["Asset","Asset Manufacturer","Asset Model", "Map","Campus","Tag","Room", "Room Monitor"]
    @date_ranges = ["Day", "Week", "Month"]
  end

  def gen_chart
    @rooms = Array.new
    Room.all.each do |room|
      @rooms << [room.name, room.asset_count]
    end

    @chart = LazyHighCharts::HighChart.new('pie') do |f|
      f.chart({:defaultSeriesType=>"pie" , :margin=> [50, 200, 60, 170]} )
      series = {
          :type=> 'pie',
          :name=> 'Asset by Rooms',
          :data=> @rooms
      }
      f.series(series)
      f.options[:title][:text] = "THA PIE"
      f.legend(:layout=> 'vertical',:style=> {:left=> 'auto', :bottom=> 'auto',:right=> '50px',:top=> '100px'})
      f.plot_options(:pie=>{
          :allowPointSelect=>true,
          :cursor=>"pointer" ,
          :dataLabels=>{
              :enabled=>true,
              :color=>"white",
              :style=>{
                  :font=>"13px Trebuchet MS, Verdana, sans-serif"
              }
          }
      })
    end

dynamic_chart.html.erb

<%  javascript 'dynamic_chart'  %>

<div id="graph_controls">
  <%= form_tag('activate_reports/dynamic_chart', :class => "well form-inline") do %>
    <%= text_field_tag(:name, nil, :class => "input-small", :placeholder => "Report Name") %>
    <%= collection_select(:activate_report, :chart_type_id, @chart_types, :id, :name, :prompt => "Select chart") %>
    <%= label_tag :x_axis, "X:", :class => "control-label" %>
    <%= select :x_axis, nil, @user_visible_models, :prompt => true %>
    <%= label_tag :y_axis, "Y:", :class => "control-label" %>
    <%= select :y_axis, nil, @user_visible_models, :prompt => true %>
    <%= select :date_range, nil, @date_ranges, :prompt => "Select a day" %>
    <%= link_to("Chart!", "#", :remote => true, :class => "btn", :onclick => 'gen_chart()') %>
  <% end %>

</div>

<div id="chart_area"></div>

_gen_chart.html.erb部分:

<%= high_chart("chart_area", @chart) %>

gen_chart js用于启动新图表的函数

function gen_chart(){
    jQuery.ajax({
        url: "/activate_reports/gen_chart",
        type: "GET",
        data: {},
        dataType: "html"
    });
}

0 个答案:

没有答案