0

こんにちは、アプリでハイチャートを使用しようとしています...そのために、ハイチャートのエピソードに従っていますが、スクリプトは機能しますが、実際のデータを入れたいときにこれを取得しました: ここに画像の説明を入力

私はすべての手順に従いましたが、ここに私のモデルがあります:

class TankingLog < ActiveRecord::Base
belongs_to :gas_station 
belongs_to :car
attr_accessible :car_id, :cost, :date, :gallon, :gas_station_id, :km
validates_presence_of :cost, :date,:gallon,:km
validates_numericality_of :cost, :gallon
validates_numericality_of :km #:only_integer
def self.total_on(date)
    where("date(date) = ?",date).sum(:cost)
end
end

ここに私のhtml.erbがあります：

<!DOCTYPE html>
<html lang="en">
<head>
    <style>
        body {
        padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
        }
    </style>
</head>
<body>
  <div class="container">
  <h1>Listing Tankings</h1>
  <% if @tankinglog.count<1 %>
    <p>
    There are no tankings for this car. Do you want to <%= link_to 'create a new tanking', new_user_car_tanking_log_path(@user, @car)%>
    </p>
  <% else %>
  <script type="text/javascript" charset="utf-8">
    $(function () {
      new Highcharts.Chart({
      chart: { renderTo: 'foo_chart' },
      title: { text: 'Tankings by Day' },
      xAxis: { type: 'datetime' },
      yAxis: {
      title: { text: 'Cost' }
    },
      series: [{
        pointInterval: <%= 1.day * 1000 %>,
        pointStart: <%= 0.weeks.ago.at_midnight.to_i * 1000 %>,
        data: [data: <%= (1.weeks.ago.to_date..Date.today).map { |date| TankingLog.total_on(date).to_f}.inspect %>]
      }]
      });
    });
  </script>
  <div id="foo_chart" style="width: 560px; height: 300px;"></div>

    <table class="table table-condensed">
      <tr>
        <th>Cost</th>
        <th>Gallon</th>
        <th>Km</th>
        <th>Date</th>
        <th>Gas Station's id</th>
        <th></th>
      </tr>
      <% for tankinglog in @tankinglog  %>
        <tr>
          <td><%= number_to_currency (tankinglog.cost) %></td>
          <td><%= tankinglog.gallon %></td>
          <td><%= tankinglog.km %></td>
          <td><%= tankinglog.date %></td>
          <td><%= tankinglog.gas_station_id %></td>
        </tr>
      <% end %>
    </table>
    <br />
    <%= link_to 'New tanking', new_user_car_tanking_log_path(@user, @car), :class => "btn btn-primary" %>
  <% end %>
  <br />
  <br />
  <%= link_to 'back', user_cars_path(current_user), :class => "btn btn-primary" %>
  </div> <!-- /container -->
</body>

ご協力いただきありがとうございます

また、ここに私のスクリプトが示すものがあります： ここに画像の説明を入力

4

2 に答える 2

1

レンダリングしようとしている foo_chart div はありますか? highcharts の js を含める前に、jQuery の js を含めましたか? ブラウザの「コンソール」の中身は？コンソールに js エラーはありますか? 画像ではなくテキストとして、生成された html を共有できますか?

コンソールからエラーを取得する方法 (Chrome) ここに画像の説明を入力

行番号をクリックすると、js が壊れた正確な場所に移動します

于 2012-08-06T17:48:02.810 に答える
0

私のせいで、構文エラーがありました。それは次のとおりです。

series: [{
        pointInterval: <%= 1.day * 1000 %>,
        pointStart: <%= 0.weeks.ago.at_midnight.to_i * 1000 %>,
        data: <%= (0.weeks.ago.to_date..Date.today).map { |date| TankingLog.total_on(date).to_f}.inspect %>
      }]

代わりに

series: [{
    pointInterval: <%= 1.day * 1000 %>,
    pointStart: <%= 0.weeks.ago.at_midnight.to_i * 1000 %>,
    data: [data: <%= (1.weeks.ago.to_date..Date.today).map { |date| TankingLog.total_on(date).to_f}.inspect %>]
  }]

手伝ってくれてありがとう

于 2012-08-06T19:58:01.140 に答える