Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Ruby

Posted by mikescs
mikescs
5,018 Points

Rails and Chart.js - How to fill out the chart with values from database

Hey Guys,

I'm using the chart-js-rails gem for rails and want to fill it out with values from database instead of just to have the static values like this:

jQuery ->
  data = {
    labels : ["January","February","March","April","May","June","July"],
    datasets : [
      {
        fillColor : "rgba(220,220,220,0.5)",
        strokeColor : "rgba(220,220,220,1)",
        pointColor : "rgba(220,220,220,1)",
        pointStrokeColor : "#fff",
        data : [65,59,90,81,56,55,40]
      }
    ]
  }

  myNewChart = new Chart($("#canvas").get(0).getContext("2d")).Line(data)

Could you please point me to the right direction how to use values from database on X and Y axis?

For example I have database table named Orders with weekday column and total_orders column. And want to have weekday (Monday...Sunday) on X and total_orders on Y.

Thank you for help :)

3 Answers

Jason Seifer
STAFF
Jason Seifer
Treehouse Guest Teacher
Jason Seifer
Jason Seifer
Treehouse Guest Teacher

Hey Mike S. I'd use something besides #each here. Try using #map to make a new array and then output that as json.

mikescs
mikescs
5,018 Points

Jason ! 

<%=  raw @days.map.to_json %>

This did the trick. But am i doing it correctly ?

Brandon Barrette
Brandon Barrette
20,485 Points
Brandon Barrette
Brandon Barrette
20,485 Points

You either are rendering the data on the page because you are displaying the data there, or doing and ajax call to render the data on another page (where it may not be called in your controller). I suggest looking into this :

http://railscasts.com/episodes/223-charts-graphs-revised

There is also the free non-revised version

http://railscasts.com/episodes/223-charts-graphs

But for $9, I think a subscription to railscasts is a steal. I've learned so much from there.

Jason Seifer
STAFF
Jason Seifer
Treehouse Guest Teacher
Jason Seifer
Jason Seifer
Treehouse Guest Teacher

Hey Mike S. generally you'll need to figure out what data on you want in your chart and then display it in your view either via ajax or even sometimes in erb layouts. In your case, you could take the data key:

data: [65,59,90,81,56,55,40]

And replace it with an array of the orders:

data: <%= @orders.map(&:total_orders) %>.to_json

Hopefully that points you in the right direction!

mikescs
mikescs
5,018 Points

Hi Jason ! Thank you very much for your answer :-) I have something like this. It returns a column from a db but it is not working. Where should i place the .to_json method call ? Should not it be in the <%= %> ?(somewhere :D)

labels :<%=   @days.each do |day| day end %>

Well i know it does not work because it gets translated as (labels :["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"],

And that .to_json thing should fix it right ?