18 Aug
Open Flash Chart II – Point by Point plotting
Got another comment, this time asking about all kinds of things:
- Plotting Points
- X Axis and Y Axis min and max ranges
- Coloring the X and Y Axis
- Coloring the X and Y gridlines
Here is the graph we are after in this example:
More Open Flash Chart II examples.
And here is the code (the controller):
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 |
class TestItController < ApplicationController def index @graph = open_flash_chart_object(600,300,"/test_it/graph_code") end def graph_code chart = OpenFlashChart.new title = Title.new("Scatter points") chart.set_title(title) scatter = Scatter.new('#FFD800', 10) # color, dot size scatter.values = [ ScatterValue.new(50,30), ScatterValue.new(305,400), ScatterValue.new(61,500,15), # x, y, dot size ScatterValue.new(600,550), ScatterValue.new(459,300), ScatterValue.new(180,789) ] chart.add_element(scatter) x = XAxis.new x.set_range(0, 650, 100) #min, max, steps # alternatively, you can use x.set_range(0,65000) and x.set_step(10000) x.colour = '#00FF00' # have to set the x axis labels because of scatter bug here - http://sourceforge.net/forum/message.php?msg_id=4812326 x.set_grid_colour('#00F0FF') chart.set_x_axis(x) y = YAxis.new y.set_range(0,800,200) y.colour = '#FF0000' y.set_grid_colour('#FF00FF') chart.set_y_axis(y) render :text => chart.to_s end end |
And in your view (index.html.erb):
1 2 3 4 |
<script type="text/javascript" src="/javascripts/swfobject.js"></script> <%= @graph %> |
Note - The X Axis is not rendering properly, this is being discussed in the OFC Forums.
Good Luck!
30 Responses
to “Open Flash Chart II – Point by Point plotting”
Sorry, comments for this entry are closed at this time.
Charlie, I copied your example into my controller and created the class ScatterValue:
class ScatterValue < OpenFlashChart
def initialize(x_value, y_value, dot_size=10)
@x = x_value
@y = y_value
@dot_size = dot_size
end
end
And it all worked like a peach. Trying to apply the same to a line chart, though, and I can’t seem to get the same results. Any tips on an initialize method for a LineValue class (or something similar?) Thanks for your help.
-Stuart
@Stuart – oh man! sorry about that, fixed it in my own code to get the scatter graphs working but completely forgot to commit it. Glad you were able to figure it out 🙂
I will work out the LineValue stuff tomorrow morning and get back to you.
Hey.. Charlie,
First off, great work on the plugin!
I do have a question regarding the set_num_decimals. Is there a way that I can use that to set the number of decimals on each bar to 2. I’m using my bar chart to display money values and can’t figure out how to display with 2 decimals.
Thanks!
@Nathan L. – I don’t see that it is part of OFC II. It was in OFC I.
For now, you can at least round in ruby, check this out – http://www.hans-eric.com/code-samples/ruby-floating-point-round-off/
Charlie, thanks for all the cool work!
Just started using openflashchart2 in a Rails 2.0.2 app, but ran into a weird infinite loop when preparing the chart data (page has a couple of your simple Bar chart samples). Eventually the stack blows:
stack level too deep
[RAILS_ROOT]/vendor/plugins/open_flash_chart/lib/open_flash_chart.rb:23:in `to_s’
[RAILS_ROOT]/vendor/plugins/open_flash_chart/lib/open_flash_chart.rb:23:in `to_json’
… hundreds more like this …
[RAILS_ROOT]/vendor/plugins/open_flash_chart/lib/open_flash_chart.rb:23:in `to_s’
[RAILS_ROOT]/vendor/plugins/open_flash_chart/lib/open_flash_chart.rb:23:in `to_json’
[RAILS_ROOT]/vendor/plugins/open_flash_chart/lib/open_flash_chart.rb:23:in `to_s’
[RAILS_ROOT]/app/controllers/test_it_controller.rb:37:in `graph_one’
I happened to start using the built-in Ruby 1.8.6 csv library the same day this started cropping up, but that’s about the only coincidental change I can relate this to.
I’m guessing some metaprogramming magic may be involved, but I have no clue how to debug it further.
Thanks for any tips!
@charlie – Can I insert an image background to the graph? or is it not yet ported?
@Mark –
Instead of doing render :text => chart.to_s just do
render :text => chart.to_json .. I guess it depends on your environment, never seen this problem before.
@syl – I will take a look and post an example.
@syl – I see where it was implemented in OFC I – http://teethgrinder.co.uk/open-flash-chart/gallery-bg-image.php
You mention that I should port it, maybe I missed it. Where did you see it for OFC II?
@charlie – Exact!! it is not implemented in OFC II… I think that if it was in OFCI it will be enabled in OFCII.
Sorry for that mistake. But do you think, I can ask to OFCII to implement that because I really need it..
@Syl – I agree, that would be nice to have. It has to come from teethgrinder, ask in the <a href="http://openflashchart.com/forum/index.php">OFC Forums</a>.
Charlie, just FYI – your suggestion to render with chart.to_json directly solved the weird problem. Thanks!
@Mark – not a problem, glad to help.
Tooltips are not appearing my case. Am I doing something wrong?
<filter:code attributes=lang="ruby">
student_comparison_graph = OpenFlashChart.new
# Set style of graph
title = Title.new("")
student_comparison_graph.title = title
student_comparison_graph.bg_colour=’#FFFFFF’
t = Tooltip.new
t.set_shadow(true)
t.stroke = 1
t.colour = ‘#000000’
t.set_background_colour("#FFFFFF")
t.set_title_style("{font-size: 10px; color: #006666;}")
t.set_body_style("{font-size: 10px; color: #006666;}")
student_comparison_graph.set_tooltip(t)
#Style set
#…code to set value array
scatter = Scatter.new(‘#000000’, 5)
scatter.values = value;
scatter.set_tooltip(‘#val#’)
x= XAxis.new
x.set_range(0,100,10)
x.colour = ‘#d1d1d1’
x.set_grid_colour(‘#d1d1d1’)
y=YAxis.new
y.set_range(0,100,50)
y.colour = ‘#FFFFFF’
y.set_grid_colour(‘#d1d1d1’)
student_comparison_graph.set_y_axis(y)
student_comparison_graph.set_x_axis(x)
student_comparison_graph.add_element(scatter)
render :text=> student_comparison_graph.to_s
< /filter:code>
@Jaikishan Jalan – The way you are doing it looks like how I would accomplish it. I am not sure that setting tooltips are available for scatter charts. You should ask Monk.e.boy in the <a href="http://openflashchart.com/forum/">OFC Forums</a> how this would be done or when this would be made available.
@Jaikishan Jalan – you have to add the following into the RAILS_ROOT/vendor/plugins/open_flash_chart.git/init.rb file:
require ‘tooltip’
Ah – ok, or you can get the latest from github – <a href="http://github.com/pullmonkey/open_flash_chart/tree/master/init.rb">http://github.com/pullmonkey/open_flash_chart/tree/master/init.rb</a>
I downloaded the latest version. But still the tool tip (only for scatter diagram) are not appearing. Is it a browser problem?I am using Firefox and I have not tried with IE as I am working with Linux. Any inputs?
I downloaded the latest version. But still the tool tip (only for scatter diagram) are not appearing. Is it a browser problem?I am using Firefox and I have not tried with IE as I am working with Linux. Any inputs?
@Jaikishan Jalan – Tool tips work for me using this example in the new version:
{"y_axis": {"steps": 200, "max": 800, "colour": "#FF0000", "min": 0, "grid-colour": "#FF00FF"}, "title": {"text": "Scatter points"}, "elements": [{"type": "scatter", "dot-size": 10, "colour": "#FFD800", "values": [{"x": 50, "y": 30}, {"x": 305, "y": 400}, {"x": 61, "y": 500, "dot-size": 15}, {"x": 600, "y": 550}, {"x": 459, "y": 300}, {"x": 180, "y": 789}]}], "x_axis": {"steps": 100, "max": 650, "colour": "#00FF00", "min": 0, "grid-colour": "#00F0FF"}}
Are you doing anything special, like modifying the tool tips?
Might have to do with your flash player version (see my other response to you).
I use linux too and with FF.
Charlie, I’m using OFC II in one of my projects successfully and then I have it installed in another project and am getting that darn stack overflow. Only, I tried switching to using chart.to_json, but that doens’t seem to help. I wish I could get a better trace, but mine looks just like the guys above as it keep references line 25 of open-flash-chart.rb. Any other ideas that I could try?
@Rodney – try chart.render instead, hope that helps.
I think I just figured out what might be happening. In some versions of the json implementation ( not sure which or why ) .to_json calls .to_s. So … I am aliasing .to_s to .render which calls .to_json which calls .to_s which calls render …… stack level too deep.
So, use chart.render and take out the alias_method :to_s, :render … let me know if you figure out where .to_json is calling .to_s and if it is some plugin that you have or something.
So remove line 32 of <a href="http://github.com/pullmonkey/open_flash_chart/tree/master/lib/open_flash_chart/base.rb">this file</a>.
This fixes the stack overflow issue:
def to_json
self.instance_values.to_json
end
see improvements at http://github.com/dfl/open_flash_chart/tree/master
Pulled down the changes, thanks David.
To see the changes – <a href="http://github.com/pullmonkey/open_flash_chart/commit/95983957d727486ee4d7463972202287cf31c730">http://github.com/pullmonkey/open_flash_chart/commit/95983957d727486ee4d7463972202287cf31c730</a>
I have created a scatter chart and would like to make each point a hyperlink. Do you know if this is possible? If so please advise on where I can find more info. Thanks, Jason
@Jason – look at <a href="http://teethgrinder.co.uk/open-flash-chart-2/line-on-click.php">this</a> for the onclick. It should be supported if you just say:<filter:code attributes=lang="ruby">scatter_point.set_on_click("<put some javascript here to redirect to another url>")</filter:code>
@charlie,
FYI, this feature in scatter charts is not supported in the current release of OFC but there is a workaround and will be fixed in the next release.
http://forums.openflashchart.com/viewtopic.php?f=4&t=388
Hi, I followed your above mentioned instructions and it worked flawlessly. But I am wondering about just one thing. Is it possible to draw the graph in four quadrants than just one?
@Chetan – sure, you can do four quadrants:
Just set your range for x and y to include negative values, although, the x-axis and y-axis are still left and bottom respectively, instead of in the center.<filter:code attributes=lang="ruby">x.set_range(-325, 325, 100)</filter:code>
Hi there,
I need to put the values at my chart as a static tooltip, directly on the chart without needing a hover action.
Somebody knows how?