I am trying to make a webpage to display line graphs in my Ruby on Rails 2.3.14 application. I found a tool, called JS Charts, which allows me to create nice graphs using Javascript, but I am having trouble sending it the data it needs. Here is the way to make a static line graph:

<script type="text/javascript">
  var myData = new Array([1, 395], [2, 244], [3, 223], [4, 210], [5, 238], [6, 223], [7, 275], [8, 31]);
  var myChart = new JSChart('chartcontainer', 'line');
  myChart.setDataArray(myData);
  myChart.draw();
</script>

I put that code into stats.html.erb, and it shows up. However, I need it to display line graph data that I provide it. A 2 dimensional array is created in the controller:

>> @a
=> [[1, 395], [2, 244], [3, 223], [4, 210], [5, 238], [6, 223], [7, 275], [8, 31]]

I should be able to use that variable in the view, and set var myData to it, with something like:

var myData = "<%= @a %>";

I tried other things like:

var myData = JSON.parse( "<%= @a.to_json %>" );

but nothing seems to work. Is there anything I can do?

EDIT:

There was an issue with the array the controller passed into the view (@a), which was empty. I was able to use:

var myData = JSON.parse( "<%= @a.to_json %>" );

to display the line graph with the right data being passed into the view.

I am trying to make a webpage to display line graphs in my Ruby on Rails 2.3.14 application. I found a tool, called JS Charts, which allows me to create nice graphs using Javascript, but I am having trouble sending it the data it needs. Here is the way to make a static line graph:

<script type="text/javascript">
  var myData = new Array([1, 395], [2, 244], [3, 223], [4, 210], [5, 238], [6, 223], [7, 275], [8, 31]);
  var myChart = new JSChart('chartcontainer', 'line');
  myChart.setDataArray(myData);
  myChart.draw();
</script>

I put that code into stats.html.erb, and it shows up. However, I need it to display line graph data that I provide it. A 2 dimensional array is created in the controller:

>> @a
=> [[1, 395], [2, 244], [3, 223], [4, 210], [5, 238], [6, 223], [7, 275], [8, 31]]

I should be able to use that variable in the view, and set var myData to it, with something like:

var myData = "<%= @a %>";

I tried other things like:

var myData = JSON.parse( "<%= @a.to_json %>" );

but nothing seems to work. Is there anything I can do?

EDIT:

There was an issue with the array the controller passed into the view (@a), which was empty. I was able to use:

var myData = JSON.parse( "<%= @a.to_json %>" );

to display the line graph with the right data being passed into the view.

• javascript
• ruby-on-rails
• json
• graph

• Good question. I'm not sure why your examples aren't working, assuming that you're in a .erb file and the ruby interpolation can work. Maybe try interpolating to a string? IE <%= @.to_s %>, because the javascript is going to evaluate what ruby injects into the script as though you had typed it in... – Andrew Commented May 2, 2012 at 4:26
• @eric paste the generated html of the result page. – Abid Commented May 2, 2012 at 4:36
• Wait, somehow it worked this time. I think there was an issue with the data the controller passed into the view (@a). I used JSON.parse( "<%= @a.to_json %>" );. I appreciate the responses at least. – Eric Commented May 2, 2012 at 4:45

1 Answer 1

Seem's like you got it working but you can clean things up a bit:

<%= javascript_tag do %>
  window.myData = <%=raw @a.to_json %>;
<% end %>

or in rails 3 you can be super HTML5 savy and use the data helpers to add your data as an att of some html tag:

<%= content_tag "div", id: "myDiv", data: {stuff: @a} do %>
<!-- some html stuff...-->
<% end %>

and then in then in the javascript (with jQuery):

var myData = $('#myDiv').data("stuff")

and for the super keen, check out this railscast