Помогите с использованием Flotilla и Ruby on Rails - PullRequest
3 голосов
/ 22 февраля 2009

Я новичок в Rails (и StackOverflow), поэтому я прошу прощения, если это "тупой" вопрос. Я собрал действительно простое приложение на Rails. Он получает данные с другого сервера (через HTTP POST). Я хотел бы отобразить график отправленных данных - в частности, я рассчитываю график зависимости температуры от времени.

Я пытаюсь использовать Flotilla для создания этих графиков, но я не могу найти много документации о том, как его использовать, за исключением примера из одной строки на домашней странице:

        = chart("graph", {"Store 1" => {:collection => @store_one, :x => :date, :y => :sales }, "Store 2" => {:collection => @store_two, :x => :date, :y => :sales }})

Это мой index.html.erb:

<table>
  <tr>
    <th>Temperature</th>
    <th>Time</th>
  </tr>

<% for post in @posts %>
  <tr>
    <td><%=h post.temperature %></td>
    <td><%=h post.created_at %></td>
  </tr>
<% end %>
</table>
<%= chart("graph", { "Graph1" => { :collection => @posts, :x => :created_at, :y => :temperature }})%>
<br />

Первая часть просто распечатывает список температур и времени. Это отлично работает. К сожалению, вторая часть - фактический график - кажется, не работает. На самом деле ничего не отображается.

Если я посмотрю на источник сгенерированного HTML, я увижу:

    <script language="javascript" type="text/javascript" src="/javascripts/jquery.flot.pack.js"></script>
    <script type="text/javascript">
      $.plot($('#graph'), [{"data":[[1234191865.0,12.0],[1234192069.0,15.0],[1234192113.0,16.0],[1234192123.0,18.0],[1234192189.0,21.0],[1234192203.0,25.0],[1234192320.0,27.0],[1234192329.0,29.0],[1234192384.0,30.0],[1234192391.0,31.0],[1234192402.0,35.0],[1234192409.0,29.0],[1234192412.0,31.0],[1234192414.0,27.0],[1234192419.0,25.0],[1234211826.0,27.0]],"label":"Graph1"}], {});
    </script>

но фактический график не отображается. Заранее спасибо за любую помощь.

Ответы [ 2 ]

6 голосов
/ 26 февраля 2011

Для меня сработало добавление этой строки вверху представления:

<%= javascript_include_tag 'jquery-1.5.1','flot/jquery.flot.js','excanvas.pack.js','jquery.flot.pack.js' %>

Это означает включить, на мой взгляд, все javascript, необходимые для использования flot. Также убедитесь, что у вас есть все файлы js в папке / public / javascripts / folder

5 голосов
/ 23 февраля 2009

Попробуйте добавить элемент div с идентификатором graph в любом месте вашей страницы; он будет использоваться как холст для диаграммы.

<div id="graph" style="width:600px;height:300px;"></div>

Элемент id должен соответствовать строке, которую вы передаете в качестве первого параметра chart.

Если вы сомневаетесь, вы можете посмотреть на источник различных примеров страниц на сайте Flot.

...