0

我正在构建一个有很多图表的应用程序。我想通过 Ajax 加载图表以减少初始加载时间。这就是当前仪表板视图的样子。

  <section class="container">
    <section class="row">
      <div class="span6 graph-container">
        <h3 class="box-header"><i class="icon-truck"></i>Service Levels</h3>
        <div class="box">
            <img src="/assets/loading.gif" class="loading" />
           <%= content_tag :div, "", id: "shipments-by-service-type", data: {shipments: @charts[:service_analysis][:spend_data]} %>
        </div>
      </div>
       <div class="span6 graph-container">
        <h3 class="box-header"><i class="icon-circle"></i>Weight Summary</h3>
        <div class="box">
          <%= content_tag :div, "", id: "weight-ranges", data: {weight: @charts[:weight_analysis][:spend_data]} %>
        </div>
      </div>
    </section>
    <section class="row">
      <div class="span6 graph-container">
        <h3 class="box-header"><i class="icon-road"></i>Zone Summary</h3>
        <div class="box">
          <%= content_tag :div, "", id: "weight-groups-zones", data: {zone: @charts[:zone_analysis][:spend_data]} %>
        </div>
      </div>
       <div class="span6 graph-container">
        <h3 class="box-header"><i class="icon-time"></i>Spend Over Time</h3>
        <div class="box">
          <%= content_tag :div, "", id: "shipping-trends", data: {trends: @charts[:shipping_trends][:spend_data]} %>
        </div>
      </div>
    </section>
  </section>

我目前的想法是成为一个名为charts_controller.rbThis 的控制器，它将包含每个图表的所有逻辑，并具有与方法相对应的视图或部分视图，然后通过 Ajax 加载这些视图中的每一个。

class ChartsController < ApplicationController

  before_filter :authenticate_user!, :company_id

  def service_level
   #logic for service_level graph
   respond_to do |format|
     format.html
     format.js
   end
  end

end

例如，我不熟悉在 Rails 中使用 Ajax，但不知道如何去做。这种方法有意义吗？

4

1 回答 1

1

您可以在服务器端部分“绘制”图表。如果您使用的是 jQuery，那么您可以使用 jQuery.load 函数：

$('#graph-div').load('/my_restful_route');

控制器将具有以下内容：

render partial: 'chart_partial'
于 2013-07-29T20:22:03.567 回答