Chartkick
Create beautiful Javascript charts with one line of Ruby. No more fighting with charting libraries!
Works with Rails, Sinatra and most browsers (including IE 6)
:two_hearts: A perfect companion to groupdate
Usage
Line chart
<%= line_chart User.group_by_day(:created_at).count %>
Pie chart
<%= pie_chart Goal.group("name").count %>
Column chart
<%= column_chart Task.group_by_hour_of_day(:created_at).count %>
Multiple series (except pie chart)
<%= line_chart @goals.map{|goal|
{:name => goal.name, :data => goal.feats.group_by_week(:created_at).count }
} %>
Say Goodbye To Timeouts
Make your pages load super fast and stop worrying about timeouts. Give each chart its own endpoint.
<%= line_chart completed_tasks_charts_path %>
And in your controller, pass the data as JSON.
class ChartsController < ApplicationController
def completed_tasks
render :json => Task.group_by_day(:completed_at).count
end
end
Note: This feature requires jQuery at the moment.
Options
Id and height
<%= line_chart User.group_by_day(:created_at).count, :id => "users-chart", :height => "500px" %>
Min and max values (except pie chart)
<%= line_chart User.group_by_day(:created_at).count, :min => 1000, :max => 5000 %>
You can pass options directly to the charting library with:
<%= line_chart User.group_by_day(:created_at).count, :library => {:backgroundColor => "#eee"} %>
Data
Pass data as a Hash or Array
<%= pie_chart({"Football" => 10, "Basketball" => 5}) %>
<%= pie_chart [["Football", 10], ["Basketball", 5]] %>
For multiple series, use the format
<%= line_chart [
{:name => "Series A", :data => series_a},
{:name => "Series B", :data => series_b}
] %>
Times can be a time, a timestamp, or a string (strings are parsed)
<%= line_chart({20.day.ago => 5, 1368174456 => 4, "2013-05-07 00:00:00 UTC" => 7}) %>
Installation
Add this line to your application's Gemfile:
gem "chartkick"
And add the javascript files to your views. These files must be included before the helper methods.
For Google Charts, use:
<%= javascript_include_tag "//www.google.com/jsapi", "chartkick" %>
If you prefer Highcharts, use:
<%= javascript_include_tag "path/to/highcharts.js", "chartkick" %>
For Rails 3.1+
chartkick.js
runs as a Rails engine - no need to install it.
For Rails 2.3 and 3.0
You must include chartkick.js
manually. Download it here
For Sinatra
You must include chartkick.js
manually. Download it here
<script src="//www.google.com/jsapi"></script>
<script src="chartkick.js"></script>
For Padrino
You must include chartkick.js
manually. Download it here
In addition, you must specify http
or https
if you use Google Charts, since Padrino tries to append .js
to protocol relative urls.
<%= javascript_include_tag "https://www.google.com/jsapi", "chartkick" %>
No Ruby? No Problem
Check out chartkick.js
Credits
Chartkick uses iso8601.js to parse dates and times.
History
View the changelog
Chartkick follows Semantic Versioning
Contributing
- Fork it
- Create your feature branch (
git checkout -b my-new-feature
) - Commit your changes (
git commit -am 'Add some feature'
) - Push to the branch (
git push origin my-new-feature
) - Create new Pull Request