Skip to main content

Using Charts in Rails Application

Hi Folks,
               i have been using charts and graphs to show statistics such for number of orders,products category,daily visits.etc.

Before i started using charts,i have been using Charts,js to show charts,which is too very easy.
Here is the link where you can get more to understand about Chart.js As i want to share more about Chartkick,which is a ruby gem which simplifies usage of Charts/Graphs in any Rails application just by simply installing the Gem and using one-line code in your view files wherein you need to pass group_by aggregated results

 Let us Start by visiting the Gthub page for Chartkick gem


  1. Install the Gem 
  2. Add the Dependent script(google chart/highchart js) in layout file
<%= javascript_include_tag "//www.google.com/jsapi", "chartkick" %>
3.YOU ARE DONE :)
Once you have the Gem,all you need to do is to decide what type of charts you want to show.which can be:-


  1. Line Chart
2. Pie Chart



3. Column/Bar Chart



4. Area Chart



5. Geo Chart



And Much more....

For all the above charts and graphs,you just need to use one line of ruby code where you specify which chart helper(pie,bar,area,line etc) you are using and pass in the array of two columns(name-> count)

So this is what you need to do to generate all of the above charts..

First  get the data to be shown on the Chart which should be always grouped by count.

###in model/controller/concerns
##i want to show how many orders are created at which particular date
##hence i am grouping them by order_date/created_at
@orders=Orders.group("DATE(order_date)").order("order_date ASC").count 
##which gives me this
##{"1.01.2015" => 10, "5.02.2015" => 5, "8.02.2015" => 25, "12.03.2015" => 50}


###in view file
<%= line_chart @orders%>
<%= pie_chart @orders%>
<%= bar_chart @orders%>
<%= geo_chart @orders%>

That's it....All the above code will generate the above shown graphs very easily.

So,now you also know how easy it is to use charts in Rails application instead of adding lots of javascript code to show the same if you have a better option-Chartkick.

I too love to use HighCharts,Chart.js but if you are looking for default charts and graphs,then this is probably the most optimal choice you can go for...




Comments

Post a Comment

Popular posts from this blog

Adding Emoji icons to Rails application

Its very easy to add emoji icons/images to your rails application. It seems complex but its all easy using javascript.The steps can be simplified as shown below:- add the javascript(download jemotion ) include it in your view file(where you want :) to be shown as this -----------------------> thats it....done first you need to add this wonderful js which works really great and nice from home page . We are interested in only the js and emotions folder(containing the smileys/GIF images). once you download just include it in your view file and copy/dump the emotions folder(containing images) to app/assets/images for RAILS 3+. as i did where i want the users to view their comments after they submit their comment. You also need to give a unique id to make  the js understand where it needs to convert your symbols to icons.see below code and hope you will understand how to use it. Keep in mind two thing:- dont forget t...
1 comment
Read more

Configure amazon s3 with your rails app in just 5 mins

if you are looking to make use of your uploads using paperclip on AMAZON S3,then this is something that will help you. i tried the same and wasted 5 days but its very easy by using ONLY aws-sdk gem and you can start uploading to S3.  Before starting i assume few thing from you: You have a running rails app ready. You have an active AMAZON S3 account (get the credentials,you will need it now) You are using paperclip 3.5.1 (i prefer) You uploads are saving to your system locally short preview of the sequence you need to understand: START -> get aws-sdk gem -> create new s3.yml -> configure an initializer-paperclip.rb using AMAZON S3 credentials ----END----------THAT'S IT lets get started: Install 'aws-sdk' gem by including in gemfile and running bundle install. Gemfile: gem 'paperclip' , '3.5.1' gem "aws-sdk"   Create new yml file such as config/s3.yml and store your AMAZON S3 credentials as shown below...
Post a Comment
Read more

Using Geocoder to get street name,state,city,country etc in Your Rails app

Recently i implemented Google map for one of the module where User will enter his location/address and other relevant geo-details should get autopopulated.Well,This was posible because of   Geocoder  and by using it you can get every small details such as postalcode,country code,zipcode,street name,state name,state code,latitude,longitude(and more) ready in your hands easily.Its really awesome. I have used to it get all relevant information about the location that the user enter using Geocomplete ,another awesome autocomplete library to get locations. Suppose you have a users table and also few columns such as longitude,latitude,state,postal code,street name,address,country  and want to autopopulate other fields just by using address entered by the user then you are reading the right blog,So its easy,let me show you how. User will enter address using Geocomplete and store that address in address column in users/locations table Then,use Geocoder to fetch other geo...
Post a Comment
Read more