Ruby On Rails Gem for FusionCharts

Add interactive charts to your RoR applications using RoR Gem for FusionCharts.

No need to write JavaScript code when you have our RoR Plugin. From rendering a chart to setting up attributes, write your code in RoR and we will take care of the rest.


  • Easily fit our plugin into RoR’s MVC paradigm.
  • Enjoy support for key FusionCharts features like annotations, macros, themes, image-export, and more.
  • Execute projects without writing separate API for JavaScript applications.
  • SQL or NoSQL, connect your chart directly to database of your choice.
  • Add data in a variety of ways, JSON, XML, or to Ruby Hashes.

Quick Demo

Simple chart
Quick demo

Quick Start

Step 1 : Install the FusionCharts Rails Gem

In the terminal run the following commands:

$ gem 'fusioncharts-rails'
$ bundle

Or install it yourself as:

$ gem install fusioncharts-rails

Step 2 : Register the Gem

You will have to download the latest FusionCharts library. Once you have downloaded and extracted, copy the JavaScript files into vendor/assets/javascripts/fusioncharts/.

Add following lines in the app/assets/javascripts/application.js

//= require fusioncharts/fusioncharts
//= require fusioncharts/fusioncharts.charts
//= require fusioncharts/themes/fusioncharts.theme.fint

Step 3 : Render your Chart

Create the FusionCharts object in the controller action like the following:

#Filename: app/controllers/dashboard_controller.rb

class DashboardController < ApplicationController

  def index

    @chart ={
        width: "600",
        height: "400",
        type: "mscolumn2d",
        renderAt: "chartContainer",
        dataSource: {
            chart: {
            caption: "Comparison of Quarterly Revenue",
            subCaption: "Harry's SuperMart",
            xAxisname: "Quarter",
            yAxisName: "Amount ($)",
            numberPrefix: "$",
            theme: "fint",
            exportEnabled: "1",
            categories: [{
                    category: [
                        { label: "Q1" },
                        { label: "Q2" },
                        { label: "Q3" },
                        { label: "Q4" }
                dataset: [
                        seriesname: "Previous Year",
                        data: [
                            { value: "10000" },
                            { value: "11500" },
                            { value: "12500" },
                            { value: "15000" }
                        seriesname: "Current Year",
                        data: [
                            { value: "25400" },
                            { value: "29800" },
                            { value: "21800" },
                            { value: "26800" }



In order to render the chart, use the render method in the specific view

<!-- Filename: app/views/dashboard/index.html.erb -->

<h3>My Chart</h3>
<div id="chartContainer"><%= @chart.render() %></div>


FusionCharts Ruby on Rails gem is open-source and distributed under the terms of the MIT/X11 License. You will still need to download and include FusionCharts in your page. This project provides no direct functionality. You can download a free evaluation version. However, You will need to purchase a FusionCharts license to use in a commercial environment (FusionCharts is free for non-commercial and personal use).