PullMonkey Blog

25 Oct

Open Flash Chart II – Updates, Radar Charts and Scatter Lines

Recently, some good work has gone into the Open Flash Chart plugin. First, it is now up to date with the official php version of OFC. That means we have Radar Charts and Scatter Line capabilities now.

Also, some nice people have helped this plugin along to maturity. I would like to thank David and Harry for their work.

David made some very much needed improvements and brought Open Flash Chart II plugin up to speed with Rails 2.x.
So take note, this is the "modern" way to work with the charts:

class TestItController < ApplicationController
  ## EDIT dont need this line with the latest plugin.
  #include OpenFlashChart
  
  def index
    respond_to do |wants|
      wants.html {
        @graph = open_flash_chart_object( 600, 300, url_for( :action => 'index', :format => :json ) )
      }
      wants.json { 
        # Edit:: don't do the OpenFlashChart::Base stuff anymore
        #chart = OpenFlashChart::Base.new( :title => Title.new("MY TITLE") ) do |c|
        chart = OpenFlashChart.new( :title => Title.new("MY TITLE") ) do |c|
          c << BarGlass.new( :values => (1..10).sort_by{rand} )
        end
        render :text => chart, :layout => false
      }
    end
  end
end

Open Flash Chart was put in to the appropriate OpenFlashChart namespace/module, to ensure we don't run into any conflicts. It also now takes blocks which will be helpful. The example above is courtesy of David.

Harry, has done a great job of providing examples for the latest features of Open Flash Chart.
Check out his Radar Chart Example.
Also, check out his Scatter Line Chart Example.

Thank you for the great work guys.

Filed under: Home, Open Flash Chart Graphs, projects, rails, ruby Tags: charts, flash, graphs, Javascript, open flash chart, rails, ruby, ruby on rails

29 Responses to “Open Flash Chart II – Updates, Radar Charts and Scatter Lines”

By Harry Seldon on Oct 25, 2008 | Reply

Thanks Charlie for this update.
I am just pointing out that the scatter line feature is very important for those <a href="http://www.thinkosphere.com/poll/mcq_txt/show_time_results/19">like me</a> interested in time series. To make it short it allows having a plot command such as plot(x,y) where x is NOT regularly spaced.
By TaSozzZ on Oct 25, 2008 | Reply

Hi! the job you are making is simply amazing. this plugin is just what i wanted.
After trying to use ofc in my work i was really disappointed cause i just kept on getting the same error. today i put the new controller code and magically it worked!!!
but i cant understand how to put data…my goal is to insert them via a database. your answer would be helpfull.
Once again a big thanx for helping me out.

best regards
By charlie on Oct 25, 2008 | Reply

@TaSozzZ – I have an example for you, using a database – <a href="http://pullmonkey.com/2008/7/25/using-a-database-to-populate-an-open-flash-chart-graph">http://pullmonkey.com/2008/7/25/using-a-database-to-populate-an-open-flash-chart-graph</a>. The only changes you need to make with the latest version of the plugins are:
1) include OpenFlashChart at the top of the controller
2) change OpenFlashChart.new to OpenFlashChart::Base.new

Hope that helps.
By T on Oct 25, 2008 | Reply

Hi —

I’m having problems installing the plugin — I had it working before, but I can’t seem to do it now. Using script/plugin install git://github.com/pullmonkey/open_flash_chart.git, it does not do an install, it just says "removing: C:/(path)/vendor/plugins/open_flash_chart/.git"

Not sure what the problem is. Plugin does not seem to be already installed.

Can anyone help me out?
By Harry Seldon on Oct 25, 2008 | Reply

Charlie, why is there this change that forces us to use "OpenFlashChart::Base.new" instead of "OpenFlashChart.new" ?
First, it is less pretty code. Then it forces to change all the calls to OpenFlashChart.
By charlie on Oct 25, 2008 | Reply

@Harry – You should actually just be able to say Chart.new(..) assuming you include OpenFlashChart. OpenFlashChart is a module now. Maybe the module should be OFC and we should keep the class as OpenFlashChart for backward compatibility.
By charlie on Oct 25, 2008 | Reply

@T – Try:
script/plugin install http://github.com/pullmonkey/open_flash_chart.git –force

With the http:// instead of git:// and put the –force at the end.
By Harry Seldon on Oct 25, 2008 | Reply

Charlie, OK I see the point. But yes I think you should indeed preserve the backward compatibility by making what you said. (Unless you want to rewrite all your examples on your blog 😉 )
By charlie on Oct 25, 2008 | Reply

@Harry – latest release allows complete backward compatibility and no need to include the module, so same as before just use OpenFlashChart.new 🙂
By George on Oct 25, 2008 | Reply

Is this compatible with 1.2.6?
By charlie on Oct 25, 2008 | Reply

@George – It probably is, although, let me know.
By Jeo on Oct 25, 2008 | Reply

Is there a way to only show 4 grid lines for a Radar graph that has values up to 100? I just want it to show the grid lines for 0, 25, 50, 75, and 100.

Also, is there a cleaner way to show only those numbers than this?
<filter:code attributes=lang="ruby">
labels = RadarAxisLabels.new(Array.new([‘0′, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ’25’,
”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ’50’,
”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ’75’,
”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ”, ‘100’ ]))
</filter:code>
By charlie on Oct 25, 2008 | Reply

@Jeo – haven’t had too much time to look into it, but based on your example I would do this:<filter:code attributes=lang="ruby">labels = RadarAxisLabels.new([0,25,50,75,100].map{|x| x == 100 ? x : [x] + [”] * 24}.flatten)</filter:code>Might be a little easier to work with. Hopefully, there is an easier way, so if I find something, I will let you know.
By Anthony Navarre on Oct 25, 2008 | Reply

I love this plugin and also this "modern" approach – kudos, guys!

While trying to cook up my own RESTful implementation, I came up with a few things that will hopefully help out others:

First of all, assuming that we’re working with a Person model, and we’re interested in some data on a specific person…

<filter:code attributes=lang="ruby">
# config/initializers/mime_types.rb
Mime::Type.register_alias "text/html", :ofc
</filter:code>

In your (RESTful) controller, use the method "formatted_person_path" to generate the proper url to send to flash (depends on the default "map.resources :people" in your routes.rb file):

<filter:code attributes=lang="ruby">
# GET /people/1
# GET /people/1.ofc
def show
@person = Person.find(params[:id])

respond_to do |wants|
wants.html {
@graph = open_flash_chart_object(600, 300, formatted_person_path(@person, :ofc))
}
wants.ofc
end
</filter:code>

In your model:

<filter:code attributes=lang="ruby">
include OpenFlashChart
def to_ofc
chart = OpenFlashChart.new(‘MY TITLE’) do |c|
# code for rendering your chart goes here
end
end
</filter:code>

Finally, we use 2 different view files…

show.html.erb

<filter:code attributes=lang="ruby">
<h1>Showing Data for <%= @person.name %></h1>
<%= @graph %>
</filter:code>

and show.ofc.erb

<filter:code attributes=lang="ruby">
<%= @person.to_ofc %>
</filter:code>

PROS:
Makes it possible for sharing of OFC-ready data from one application to another

CONS:
With current plugin implementation, this approach necessitates inclusion of the module in your models ("include OpenFlashChart")
May bloat your model code, but of course that’s better than bloating the controller

I can foresee that this approach might pave the way for easily showing graphs on nested resources, or implementing custom to_ofc methods on associated collections, perhaps by using named_scope or similar:

To show all scores for exam #15:
/exams/15/scores.ofc

To show most popular tags for a specific blog category
/categories/my-category-title/tags.ofc

Thoughts?
By charlie on Oct 25, 2008 | Reply

@Anthony Navarre – very nice, thanks for providing your example.
By gnubbs on Oct 25, 2008 | Reply

Hi,

Quick question… I tried to use this example code, and it worked fine when I included the graph on the index action. However, I want to show a graph on the show action. When I try I get:

This is the URL that I tried to open:http://localhost:3000/casses/show/2.json

instead of the graph. If I go directly to that URL I get a DoubleRender error from rails.

Any ideas? I am very excited about this library, and really appreciate your work on it.
By charlie on Oct 25, 2008 | Reply

@gnubbs – I would have to see some code to be sure. You will not see the graph on show/2.json, you will see it at show/2 or show/2.html which will call show/2.json for you to produce the graph.
By Giovanni on Oct 25, 2008 | Reply

Example of a graph line with error band and another example of radar chart

http://ingiroingiro.blogspot.com/

Many thanks for this plugin, was what I needed
By Harry Seldon on Oct 25, 2008 | Reply

Hey guys, I have updated the OFC test app so that it uses the latest version of OFC plugin.
Anthony and Giovanni, that would be great if you could put your codes in that app.

For reference, the OFC test app <a href="http://harryseldon.thinkosphere.com/2008/11/07/a-test-and-example-app-for-open-flash-chart-rails-plugin">is described here.</a>

How to use GIT to contribute <a href="http://harryseldon.thinkosphere.com/2008/11/08/grand-gardening-with-git">is explained here.</a>
By Kimmo on Oct 25, 2008 | Reply

Maybe a bit off topic, but I have problems trying to use multiple parameters for the graphs, is this a problem in OFC? If I do something like /ofc/graph?foo=bar&stuff=fluff I only get params[:foo] in the data request.
By charlie on Oct 25, 2008 | Reply

@Kimmo, that looks fine to me, I can’t imagine OFC having any affect on request params. But maybe you should post params.inspect and your controller code just to be sure.
By gonzoFish on Oct 25, 2008 | Reply

@Kimmo, you figure this out? I’m having the same problem with OFC. It’s converting the & separating variables to & in the javascript and there’s no way I can figure out to rid it of this problem…anyone have an idea?
By charlie on Oct 25, 2008 | Reply

@gonzoFish or @Kimmo – could one of you post some sample code that is having this problem? Then I will take a look.
By rogelio on Oct 25, 2008 | Reply

@Kimmo, @gonzoFish just replace the "&" by "%26", this work for me.
By Christoffer on Oct 25, 2008 | Reply

Nice plugin. But is there a way to change the background color of the charts? I know this is possible in PHP but I can’t find a way to do it in the Rails plugin. I searched the source for it but just couldn’t find a way to do this.

Is it possible? Will it be in the future? Please, let me know.
By charlie on Oct 25, 2008 | Reply

@Christoffer – Yes, you can set the background color. Just like you do for PHP. chart.set_background_colour(‘#fff’)
Or more rubyish – chart.background_colour = ‘#fff’

The plugin uses method_missing() to do everything. There really is no source code. If you want to get a better idea of how it works, read this post about the upcoming version of OFC – http://pullmonkey.com/2009/4/30/open-flash-chart-ii-fully-automated
By charlie on Oct 25, 2008 | Reply

@Christoffer – actually it is bg_colour.
I use it <a href="http://pullmonkey.com/2008/7/25/using-a-database-to-populate-an-open-flash-chart-graph">here</a>.
By Vandita on Aug 24, 2012 | Reply

Had a very basic question. Which editor are you using??
By charlie on Sep 5, 2012 | Reply

Vandita – I’m using vim (with rails.vim) and tmux.

Sorry, comments for this entry are closed at this time.

Open Flash Chart II – Updates, Radar Charts and Scatter Lines

29 Responses to “Open Flash Chart II – Updates, Radar Charts and Scatter Lines”

Topics

Recent Posts

Recent Comments

Archives