Overview¶ ↑

This Ruby library, GoogleVisualr, is a wrapper around the Google Visualization API and allows you to create the same visualizations with just pure Ruby; you don’t have to write any JavaScript at all.

Good for any Ruby on Rails setup whereby you prefer to work your logic in models or controllers.

Please refer to the GoogleVisualr reference site for a complete list of visualizations that you can create with GoogleVisualr.

The Gist¶ ↑

• In your model or controller, write Ruby code to create your visualization (e.g. Area Chart, Bar Chart, even Spark Lines etc).

• Configure your visualization with all the options as listed in Google Visualization API Docs. E.g. Area Chart’s configuration options.

• In your view, just call a visualization.render(div_id) method that will magically generate and insert JavaScript into the final HTML output.

• You get your visualization, and you didn’t write any JavaScript!

Limitations¶ ↑

Do note that GoogleVisualr is not a 100% complete wrapper for the Google Visualization API. These are not implemented for sake of simplicity:

• JavaScript Methods for use after a visualization has been rendered in a view. E.g. Area Chart’s methods.

• JavaScript Events for use after a visualization has been rendered in a view. E.g. Area Chart’s events.

• Visualizations not created by Google, and a few image-only charts.

Install¶ ↑

Just install the GitHub repository into your app/vendor/plugin folder.

> rails my_app; cd my_app;
> script/plugin install [email protected]:winston/google_visualr.git

Basics¶ ↑

This section describes a basic implementation of the GoogleVisualr::AreaChart class.

Please review the Docs for detailed documentation and advanced implementation of constructors and methods.

---

In your Rails layout, load Google Ajax API in the head tag, at the very top.

<script src='http://www.google.com/jsapi'></script>

In your Rails controller, initialize a visualization (area chart) with an empty constructor.

@chart = GoogleVisualr::AreaChart.new

Populate visualization with column headers, and row values.

# Add Column Headers
@chart.add_column('string', 'Year' )
@chart.add_column('number', 'Sales')
@chart.add_column('number', 'Expenses')

# Add Rows and Values
@chart.add_rows(4)
@chart.set_value(0, 0, '2004')
@chart.set_value(0, 1, 1000)
@chart.set_value(0, 2, 400)
@chart.set_value(1, 0, '2005')
@chart.set_value(1, 1, 1170)
@chart.set_value(1, 2, 460)
@chart.set_value(2, 0, '2006')
@chart.set_value(2, 1, 1500)
@chart.set_value(2, 2, 660)
@chart.set_value(3, 0, '2007')
@chart.set_value(3, 1, 1030)
@chart.set_value(3, 2, 540)

Configure visualization with options.

@chart.width = 400
@chart.height = 240

In your Rails view, render visualization.

<div id='chart'></div>
<%= @chart.render('chart') %>

Support¶ ↑

Please submit all feedback, bugs and feature-requests to GitHub Issues Tracker.

Please also feel free to clone/fork the project, and improve it further!

Author¶ ↑

GoogleVisualr is maintained by Winston Teo, and his Ninja Penguin.

Who is Winston Teo? Find out more on WinstonYW, LinkedIn, or follow Winston on Twitter.

License¶ ↑

Copyright © 2010 Winston Teo Yong Wei. Free software, released under the MIT license.