@@ -1,3 +1,10 @@ +== 1.3.4 +* updated documentation and cleaned it up (mokolabs) +* added support for custom class, id and alt tags when using the image_tag format (i.e Gchart.line(:data => [0, 26], :format => 'image_tag')) (mokolabs) + +== 1.3.2 - 1.3.3 +* changes required by github + == 1.3.1 * added width and spacing options History.txt @@ -1,14 +1,20 @@ The goal of this Gem is to make the creation of Google Charts a simple and easy task. -Gchart.line( :size => '200x300', - :title => "example title", - :bg => 'efefef', - :legend => ['first data set label', 'second data set label'], - :data => [10, 30, 120, 45, 72]) + Gchart.line( :size => '200x300', + :title => "example title", + :bg => 'efefef', + :legend => ['first data set label', 'second data set label'], + :data => [10, 30, 120, 45, 72]) +Check out the [full documentation over there](http://googlecharts.rubyforge.org/) -==Chart Type +This gem is fully tested using Rspec, check the rspec folder for more examples. + +See at the bottom of this file who reported using this gem. + +Chart Type +------------- This gem supports the following types of charts: @@ -20,6 +26,7 @@ This gem supports the following types of charts: * venn * pie * pie_3d + * google meter To create a chart, simply require Gchart and call any of the existing type: @@ -27,7 +34,8 @@ To create a chart, simply require Gchart and call any of the existing type: Gchart.pie -==Chart Title +Chart Title +------------- To add a title to a chart pass the title to your chart: @@ -37,7 +45,8 @@ You can also specify the color and/or size Gchart.line(:title => 'Sexy Charts!', :title_color => 'FF0000', :title_size => '20') -==Colors +Colors +------------- Specify a color with at least a 6-letter string of hexadecimal values in the format RRGGBB. For example: @@ -56,7 +65,8 @@ If you need to use multiple colors, check the doc. Usually you just need to pass Some charts have more options than other, make sure to refer to the documentation. -===Background options: +Background options: +------------- If you don't set the background option, your graph will be transparent. @@ -99,7 +109,8 @@ Another type of fill is stripes http://code.google.com/apis/chart/#linear_stripe You can customize the amount of stripes, colors and width by changing the color value. -== Legend & Labels +Legend & Labels +------------- You probably will want to use a legend or labels for your graph. @@ -111,7 +122,8 @@ Will do the trick. You can also use the labels alias (makes more sense when usin chart = Gchart.pie(:labels => ['label 1', 'label 2']) -== Multiple axis labels +Multiple axis labels +------------- Multiple axis labels are available for line charts, bar charts and scatter plots. @@ -127,32 +139,34 @@ To add labels on these axis: Gchart.line(:axis_labels => ['Jan|July|Jan|July|Jan', '0|100', 'A|B|C', '2005|2006|2007']) -== Data options +Data options +------------- Data are passed using an array or a nested array. - Gchart.bar(:data => [1,2,4,67,100,41,234]) + Gchart.bar(:data => [1,2,4,67,100,41,234]) - Gchart.bar(:data => [[1,2,4,67,100,41,234],[45,23,67,12,67,300, 250]]) + Gchart.bar(:data => [[1,2,4,67,100,41,234],[45,23,67,12,67,300, 250]]) By default, the graph is drawn with your max value representing 100% of the height or width of the graph. You can change that my passing the max value. - Gchart.bar(:data => [1,2,4,67,100,41,234], :max_value => 300) - Gchart.bar(:data => [1,2,4,67,100,41,234], :max_value => 'auto') + Gchart.bar(:data => [1,2,4,67,100,41,234], :max_value => 300) + Gchart.bar(:data => [1,2,4,67,100,41,234], :max_value => 'auto') or if you want to use the real values from your dataset: - Gchart.bar(:data => [1,2,4,67,100,41,234], :max_value => false) + Gchart.bar(:data => [1,2,4,67,100,41,234], :max_value => false) You can also define a different encoding to add more granularity: - Gchart.bar(:data => [1,2,4,67,100,41,234], :encoding => 'simple') - Gchart.bar(:data => [1,2,4,67,100,41,234], :encoding => 'extended') - Gchart.bar(:data => [1,2,4,67,100,41,234], :encoding => 'text') + Gchart.bar(:data => [1,2,4,67,100,41,234], :encoding => 'simple') + Gchart.bar(:data => [1,2,4,67,100,41,234], :encoding => 'extended') + Gchart.bar(:data => [1,2,4,67,100,41,234], :encoding => 'text') -==Pies: +Pies: +------------- you have 2 type of pies: - Gchart.pie() the standard 2D pie @@ -164,40 +178,68 @@ To set labels, you can use one of these two options: Gchart.pie_3d(:title => @title, :labels => @legend, :data => @data, :size => '400x200') Gchart.pie_3d(:title => @title, :legend => @legend, :data => @data, :size => '400x200') -==Bars: +Bars: +------------- A bar chart can accept options to set the width of the bars, spacing between bars and spacing between bar groups. To set these, you can either provide a string, array or hash. The Google API sets these options in the order of width, spacing, and group spacing, with both spacing values being optional. So, if you provide a string or array, provide them in that order: - Gchart.bar(:data => @data, :bar_width_and_spacing => '25,6') # width of 25, spacing of 6 - Gchart.bar(:data => @data, :bar_width_and_spacing => '25,6,12') # width of 25, spacing of 6, group spacing of 12 - Gchart.bar(:data => @data, :bar_width_and_spacing => [25,6]) # width of 25, spacing of 6 - Gchart.bar(:data => @data, :bar_width_and_spacing => 25) # width of 25 + Gchart.bar(:data => @data, :bar_width_and_spacing => '25,6') # width of 25, spacing of 6 + Gchart.bar(:data => @data, :bar_width_and_spacing => '25,6,12') # width of 25, spacing of 6, group spacing of 12 + Gchart.bar(:data => @data, :bar_width_and_spacing => [25,6]) # width of 25, spacing of 6 + Gchart.bar(:data => @data, :bar_width_and_spacing => 25) # width of 25 The hash lets you set these values directly, with the Google default values set for any options you don't include: - Gchart.bar(:data => @data, :bar_width_and_spacing => {:width => 19}) - Gchart.bar(:data => @data, :bar_width_and_spacing => {:spacing => 10, :group_spacing => 12}) + Gchart.bar(:data => @data, :bar_width_and_spacing => {:width => 19}) + Gchart.bar(:data => @data, :bar_width_and_spacing => {:spacing => 10, :group_spacing => 12}) -==Sparklines: +Sparklines: +------------- A sparkline chart has exactly the same parameters as a line chart. The only difference is that the axes lines are not drawn for sparklines by default. -==Google-o-meter +Google-o-meter +------------- A Google-o-meter has a few restrictions. It may only use a solid filled background and it may only have one label. -=== try yourself +try yourself +------------- -Gchart.bar( :data => [[1,2,4,67,100,41,234],[45,23,67,12,67,300, 250]], - :title => 'SD Ruby Fu level', - :legend => ['matt','patrick'], - :bg => {:color => '76A4FB', :type => 'gradient'}, - :bar_colors => 'ff0000,00ff00') + Gchart.bar( :data => [[1,2,4,67,100,41,234],[45,23,67,12,67,300, 250]], + :title => 'SD Ruby Fu level', + :legend => ['matt','patrick'], + :bg => {:color => '76A4FB', :type => 'gradient'}, + :bar_colors => 'ff0000,00ff00') "http://chart.apis.google.com/chart?chs=300x200&chdl=matt|patrick&chd=s:AAANUIv,JENCN9y&chtt=SDRuby+Fu+level&chf=bg,lg,0,76A4FB,0,ffffff,1&cht=bvs&chco=ff0000,00ff00" -Gchart.pie(:data => [20,10,15,5,50], :title => 'SDRuby Fu level', :size => '400x200', :labels => ['matt', 'rob', 'patrick', 'ryan', 'jordan']) + Gchart.pie(:data => [20,10,15,5,50], :title => 'SDRuby Fu level', :size => '400x200', :labels => ['matt', 'rob', 'patrick', 'ryan', 'jordan']) http://chart.apis.google.com/chart?cht=p&chs=400x200&chd=s:YMSG9&chtt=SDRuby+Fu+level&chl=matt|rob|patrick|ryan|jordan + + +People reported using this gem: +--------------------- + + + +* [http://github.com](http://github.com) + + + +* [http://stafftool.com/](http://stafftool.com/) Takeo (contributor) + + + +* [graffleropia.com](http://graffletopia.com) Mokolabs (contributor) + + + +* [http://gumgum.com](http://gumgum.com) Mattetti (Author) + +![http://img.skitch.com/20080627-n48j8pb2r7irsewfeh4yp3da12.jpg] + +* [http://feedflix.com/](http://feedflix.com/) [lifehacker article](http://lifehacker.com/395610/feedflix-creates-detailed-charts-from-your-netflix-use) \ No newline at end of file README.markdown @@ -1,180 +1,9 @@ -The goal of this Gem is to make the creation of Google Charts a simple and easy task. +CHECK README.markdown (open as a text file) -Gchart.line( :size => '200x300', - :title => "example title", - :bg => 'efefef', - :legend => ['first data set label', 'second data set label'], - :data => [10, 30, 120, 45, 72]) - +Or check: + http://googlecharts.rubyforge.org -==Chart Type +and/or -This gem supports the following types of charts: - - * line, - * line_xy - * sparkline - * scatter - * bar - * venn - * pie - * pie_3d - -To create a chart, simply require Gchart and call any of the existing type: - - require 'gchart' - Gchart.pie - - -==Chart Title - - To add a title to a chart pass the title to your chart: - - Gchart.line(:title => 'Sexy Charts!') - -You can also specify the color and/or size - - Gchart.line(:title => 'Sexy Charts!', :title_color => 'FF0000', :title_size => '20') - -==Colors - -Specify a color with at least a 6-letter string of hexadecimal values in the format RRGGBB. For example: - - * FF0000 = red - * 00FF00 = green - * 0000FF = blue - * 000000 = black - * FFFFFF = white - -You can optionally specify transparency by appending a value between 00 and FF where 00 is completely transparent and FF completely opaque. For example: - - * 0000FFFF = solid blue - * 0000FF00 = transparent blue - -If you need to use multiple colors, check the doc. Usually you just need to pass :attribute => 'FF0000,00FF00' - -Some charts have more options than other, make sure to refer to the documentation. - -===Background options: - -If you don't set the background option, your graph will be transparent. - -* You have 3 types of background http://code.google.com/apis/chart/#chart_or_background_fill - -- solid -- gradient -- stripes - -By default, if you set a background color, the fill will be solid: - - Gchart.bar(:bg => 'efefef') - -However you can specify another fill type such as: - - Gchart.line(:bg => {:color => 'efefef', :type => 'gradient'}) - -In the above code, we decided to have a gradient background, however since we only passed one color, the chart will start by the specified color and transition to white. By the default, the gradient angle is 0. Change it as follows: - - Gchart.line(:title =>'bg example', :bg => {:color => 'efefef', :type => 'gradient', :angle => 90}) - -For a more advance use of colors, refer to http://code.google.com/apis/chart/#linear_gradient - - Gchart.line(:bg => {:color => '76A4FB,1,ffffff,0', :type => 'gradient'}) - - -The same way you set the background color, you can also set the graph background: - - Gchart.line(:graph_bg => 'cccccc') - -or both - - Gchart.line(:bg => {:color => '76A4FB,1,ffffff,0', :type => 'gradient'}, :graph_bg => 'cccccc', :title => 'Sexy Chart') - - -Another type of fill is stripes http://code.google.com/apis/chart/#linear_stripes - - Gchart.line(:bg => {:color => 'efefef', :type => 'stripes'}) - -You can customize the amount of stripes, colors and width by changing the color value. - - -== Legend & Labels - -You probably will want to use a legend or labels for your graph. - - Gchart.line(:legend => 'legend label') -or - Gchart.line(:legend => ['legend label 1', 'legend label 2']) - -Will do the trick. You can also use the labels alias (makes more sense when using the pie charts) - - chart = Gchart.pie(:labels => ['label 1', 'label 2']) - -== Multiple axis labels - -Multiple axis labels are available for line charts, bar charts and scatter plots. - -* x = bottom x-axis -* t = top x-axis -* y = left y-axis -* r = right y-axis - - Gchart.line(:label_axis => 'x,y,r') - -To add labels on these axis: - - Gchart.line(:axis_labels => ['Jan|July|Jan|July|Jan', '0|100', 'A|B|C', '2005|2006|2007']) - - -== Data options - -Data are passed using an array or a nested array. - - Gchart.bar(:data => [1,2,4,67,100,41,234]) - - Gchart.bar(:data => [[1,2,4,67,100,41,234],[45,23,67,12,67,300, 250]]) - -By default, the graph is drawn with your max value representing 100% of the height or width of the graph. You can change that my passing the max value. - - Gchart.bar(:data => [1,2,4,67,100,41,234], :max_value => 300) - Gchart.bar(:data => [1,2,4,67,100,41,234], :max_value => 'auto') - -or if you want to use the real values from your dataset: - - Gchart.bar(:data => [1,2,4,67,100,41,234], :max_value => false) - - -You can also define a different encoding to add more granularity: - - Gchart.bar(:data => [1,2,4,67,100,41,234], :encoding => 'simple') - Gchart.bar(:data => [1,2,4,67,100,41,234], :encoding => 'extended') - Gchart.bar(:data => [1,2,4,67,100,41,234], :encoding => 'text') - - -==Pies: - -you have 2 type of pies: - - Gchart.pie() the standard 2D pie - _ Gchart.pie_3d() the fancy 3D pie - -To set labels, you can use one of these two options: - - @legend = ['Matt_fu', 'Rob_fu'] - Gchart.pie_3d(:title => @title, :labels => @legend, :data => @data, :size => '400x200') - Gchart.pie_3d(:title => @title, :legend => @legend, :data => @data, :size => '400x200') - - - -=== try yourself - -Gchart.bar( :data => [[1,2,4,67,100,41,234],[45,23,67,12,67,300, 250]], - :title => 'SDRuby Fu level', - :legend => ['matt','patrick'], - :bg => {:color => '76A4FB', :type => 'gradient'}, - :bar_colors => 'ff0000,00ff00') - - "http://chart.apis.google.com/chart?chs=300x200&chdl=matt|patrick&chd=s:AAANUIv,JENCN9y&chtt=SDRuby+Fu+level&chf=bg,lg,0,76A4FB,0,ffffff,1&cht=bvs&chco=ff0000,00ff00" - -Gchart.pie(:data => [20,10,15,5,50], :title => 'SDRuby Fu level', :size => '400x200', :labels => ['matt', 'rob', 'patrick', 'ryan', 'jordan']) -http://chart.apis.google.com/chart?cht=p&chs=400x200&chd=s:YMSG9&chtt=SDRuby+Fu+level&chl=matt|rob|patrick|ryan|jordan + http://github.com/mattetti/googlecharts \ No newline at end of file README.txt @@ -1,6 +1,6 @@ Gem::Specification.new do |s| s.name = %q{googlecharts} - s.version = "1.3.3" + s.version = "1.3.4" s.specification_version = 2 if s.respond_to? :specification_version= googlecharts.gemspec @@ -15,27 +15,24 @@ class Gchart @@file_name = 'chart.png' attr_accessor :title, :type, :width, :height, :horizontal, :grouped, :legend, :data, :encoding, :max_value, :bar_colors, - :title_color, :title_size, :custom, :axis_with_labels, :axis_labels, :bar_width_and_spacing + :title_color, :title_size, :custom, :axis_with_labels, :axis_labels, :bar_width_and_spacing, :id, :alt, :class - class << self - # Support for Gchart.line(:title => 'my title', :size => '400x600') - def method_missing(m, options={}) - # Extract the format and optional filename, then clean the hash - format = options[:format] || 'url' - @@file_name = options[:filename] unless options[:filename].nil? - options.delete(:format) - options.delete(:filename) - # create the chart and return it in the format asked for - if @@types.include?(m.to_s) - chart = new(options.merge!({:type => m})) - chart.send(format) - elsif m.to_s == 'version' - Gchart::VERSION::STRING - else - "#{m} is not a supported chart format, please use one of the following: #{supported_types}." - end - end - + # Support for Gchart.line(:title => 'my title', :size => '400x600') + def self.method_missing(m, options={}) + # Extract the format and optional filename, then clean the hash + format = options[:format] || 'url' + @@file_name = options[:filename] unless options[:filename].nil? + options.delete(:format) + options.delete(:filename) + # create the chart and return it in the format asked for + if @@types.include?(m.to_s) + chart = new(options.merge!({:type => m})) + chart.send(format) + elsif m.to_s == 'version' + Gchart::VERSION::STRING + else + "#{m} is not a supported chart format, please use one of the following: #{supported_types}." + end end def initialize(options={}) @@ -47,8 +44,11 @@ class Gchart @grouped = false @encoding = 'simple' @max_value = 'auto' + # Sets the alt tag when chart is exported as image tag @alt = 'Google Chart' + # Sets the CSS id selector when chart is exported as image tag @id = false + # Sets the CSS class selector when chart is exported as image tag @class = false # set the options value if definable @@ -71,33 +71,6 @@ class Gchart "#{@width}x#{@height}" end - # Sets the alt tag when chart is exported as image tag - def alt=(alt='Google Chart') - @alt = alt - end - - def alt - @alt - end - - # Sets the CSS id selector when chart is exported as image tag - def id=(id=false) - @id = id - end - - def id - @id - end - - # Sets the CSS class selector when chart is exported as image tag - def class=(klass=false) - @class = klass - end - - def class - @class - end - # Sets the orientation of a bar graph def orientation=(orientation='h') if orientation == 'h' || orientation == 'horizontal' lib/gchart.rb @@ -2,7 +2,7 @@ module GchartInfo #:nodoc: module VERSION #:nodoc: MAJOR = 1 MINOR = 3 - TINY = 2 + TINY = 4 STRING = [MAJOR, MINOR, TINY].join('.') end lib/gchart/version.rb @@ -33,7 +33,7 @@ <h1>Googlecharts</h1> <div id="version" class="clickable" onclick='document.location = "http://rubyforge.org/projects/googlecharts"; return false'> <p>Get Version</p> - <a href="http://rubyforge.org/projects/googlecharts" class="numbers">1.3.2</a> + <a href="http://rubyforge.org/projects/googlecharts" class="numbers">1.3.4</a> </div> <h2>&#x2192; &#8216;Sexy Charts using Google <span class="caps">API</span> &#38; Ruby&#8217;</h2> @@ -41,7 +41,8 @@ <h2>What</h2> - <p>A nice and simple wrapper for <a href="http://code.google.com/apis/chart/">Google Chart <span class="caps">API</span></a></p> + <p>A nice and simple wrapper for <a href="http://code.google.com/apis/chart/">Google Chart <span class="caps">API</span></a> +(Fully tested using RSpec, check the specs for more usage examples)</p> <h2>Installing</h2> @@ -668,6 +669,34 @@ Data set: <p>The trunk repository is <code>http://github.com/mattetti/googlecharts/</code> for anonymous access.</p> + <h2>People reported using this gem</h2> + + +<div> + <img src="http://img.skitch.com/20080627-r14subqdx2ye3w13qefbx974gc.png" alt="github"/><br/> + <li><a href="http://github.com">http://github.com</a></li><br/> +</div> + +<div> + <img src="http://stafftool.com/images/masthead_screen.gif" alt="stafftool"/><br/> + <li><a href="http://stafftool.com/">Takeo(contributor)</a></li><br/> +</div> + +<div> + <img src="http://img.skitch.com/20080627-g2pp89h7gdbh15m1rr8hx48jep.jpg" alt="graffletopia"/><br/> + <li><a href="http://graffletopia.com"> http://graffletopia.com Mokolabs(contributor)</a></li><br/> +</div> + +<div> + <img src="http://img.skitch.com/20080627-kc1weqsbkmxeqhwiyriq3n6g8k.jpg" alt="gumgum"/><br/> + <li><a href="http://gumgum.com"> http://gumgum.com Mattetti(contributor)</a></li><br/> +</div> + +<div> + <img src="http://img.skitch.com/20080627-n48j8pb2r7irsewfeh4yp3da12.jpg" alt="gumgum"/><br/> + <li><a href="http://feedflix.com/"> http://feedflix.com/</a></li><br/> +</div> + <h2>License</h2> website/index.html @@ -6,6 +6,7 @@ h2. &#x2192; 'Sexy Charts using Google API & Ruby' h2. What A nice and simple wrapper for "Google Chart API":http://code.google.com/apis/chart/ +(Fully tested using RSpec, check the specs for more usage examples) h2. Installing @@ -472,11 +473,39 @@ Gchart.line(:data => [100, 20, 30, 20, 10, 14, 30, 10], :max_value => false ) !http://chart.apis.google.com/chart?cht=lc&chs=300x200&chd=s:_UeUKOeK(real size)! - h2. Repository The trunk repository is <code>http://github.com/mattetti/googlecharts/</code> for anonymous access. +h2. People reported using this gem + + + <div> + <img src="http://img.skitch.com/20080627-r14subqdx2ye3w13qefbx974gc.png" alt="github"/><br/> + <li><a href="http://github.com">http://github.com</a></li><br/> + </div> + + <div> + <img src="http://stafftool.com/images/masthead_screen.gif" alt="stafftool"/><br/> + <li><a href="http://stafftool.com/">Takeo(contributor)</a></li><br/> + </div> + + <div> + <img src="http://img.skitch.com/20080627-g2pp89h7gdbh15m1rr8hx48jep.jpg" alt="graffletopia"/><br/> + <li><a href="http://graffletopia.com"> http://graffletopia.com Mokolabs(contributor)</a></li><br/> + </div> + + <div> + <img src="http://img.skitch.com/20080627-kc1weqsbkmxeqhwiyriq3n6g8k.jpg" alt="gumgum"/><br/> + <li><a href="http://gumgum.com"> http://gumgum.com Mattetti(contributor)</a></li><br/> + </div> + + <div> + <img src="http://img.skitch.com/20080627-n48j8pb2r7irsewfeh4yp3da12.jpg" alt="gumgum"/><br/> + <li><a href="http://feedflix.com/"> http://feedflix.com/</a></li><br/> + </div> + + h2. License This code is free to use under the terms of the MIT license. website/index.txt e1a2b1c2ba680f4c7ed54220094f1489cd0e031e Matt Aimonetti mattaimonetti@gmail.com http://github.com/mattetti/googlecharts/commit/a93fc6edf3bb5c435073798a2f4e9aaa45cd14ba a93fc6edf3bb5c435073798a2f4e9aaa45cd14ba 2008-06-26T23:41:30-07:00 2008-06-26T23:41:30-07:00 updated doc + re-factored a bit - 1.3.4 is out the door! 3fb929977b78006d3e77ef3a687bcea5c41ff23a Matt Aimonetti mattaimonetti@gmail.com