css_graphs 0.1.0
Sign up to get free protection for your applications and to get access to all the features.
- data/History.txt +14 -0
- data/MIT-LICENSE +20 -0
- data/Manifest.txt +17 -0
- data/README.txt +23 -0
- data/Rakefile +14 -0
- data/about.yml +7 -0
- data/generators/css_graphs/css_graphs_generator.rb +15 -0
- data/generators/css_graphs/templates/.DS_Store +0 -0
- data/generators/css_graphs/templates/colorbar.jpg +0 -0
- data/generators/css_graphs/templates/g_colorbar.jpg +0 -0
- data/generators/css_graphs/templates/g_colorbar2.jpg +0 -0
- data/generators/css_graphs/templates/g_marker.gif +0 -0
- data/images/.DS_Store +0 -0
- data/images/colorbar.jpg +0 -0
- data/init.rb +2 -0
- data/lib/css_graphs.rb +371 -0
- data/test/test_css_graphs.rb +65 -0
- metadata +73 -0
data/History.txt
ADDED
@@ -0,0 +1,14 @@
|
|
1
|
+
== 0.1.0
|
2
|
+
|
3
|
+
* Converted to Hoe
|
4
|
+
* Available as a RubyGem
|
5
|
+
|
6
|
+
== April 13, 2007
|
7
|
+
|
8
|
+
* Added sizing and multi-graph bar enhancements by Maximiliano Guzman
|
9
|
+
* Added test suite that generates HTML files in test/output
|
10
|
+
|
11
|
+
== Feb 5, 2007
|
12
|
+
|
13
|
+
* Enhanced all methods to take an array instead of requiring you to use *array
|
14
|
+
* bar_graph() normalizes the data when rendering to make it usable for many values.
|
data/MIT-LICENSE
ADDED
@@ -0,0 +1,20 @@
|
|
1
|
+
Copyright (c) 2005 Geoffrey Grosenbach
|
2
|
+
|
3
|
+
Permission is hereby granted, free of charge, to any person obtaining
|
4
|
+
a copy of this software and associated documentation files (the
|
5
|
+
"Software"), to deal in the Software without restriction, including
|
6
|
+
without limitation the rights to use, copy, modify, merge, publish,
|
7
|
+
distribute, sublicense, and/or sell copies of the Software, and to
|
8
|
+
permit persons to whom the Software is furnished to do so, subject to
|
9
|
+
the following conditions:
|
10
|
+
|
11
|
+
The above copyright notice and this permission notice shall be
|
12
|
+
included in all copies or substantial portions of the Software.
|
13
|
+
|
14
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
15
|
+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
16
|
+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
17
|
+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
18
|
+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
19
|
+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
20
|
+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
data/Manifest.txt
ADDED
@@ -0,0 +1,17 @@
|
|
1
|
+
History.txt
|
2
|
+
MIT-LICENSE
|
3
|
+
Manifest.txt
|
4
|
+
README.txt
|
5
|
+
Rakefile
|
6
|
+
about.yml
|
7
|
+
generators/css_graphs/css_graphs_generator.rb
|
8
|
+
generators/css_graphs/templates/.DS_Store
|
9
|
+
generators/css_graphs/templates/colorbar.jpg
|
10
|
+
generators/css_graphs/templates/g_colorbar.jpg
|
11
|
+
generators/css_graphs/templates/g_colorbar2.jpg
|
12
|
+
generators/css_graphs/templates/g_marker.gif
|
13
|
+
images/.DS_Store
|
14
|
+
images/colorbar.jpg
|
15
|
+
init.rb
|
16
|
+
lib/css_graphs.rb
|
17
|
+
test/test_css_graphs.rb
|
data/README.txt
ADDED
@@ -0,0 +1,23 @@
|
|
1
|
+
= css_graphs
|
2
|
+
|
3
|
+
Makes graphs using pure CSS.
|
4
|
+
|
5
|
+
Includes itself in the ActionView::Helpers::TextHelper module, so no extra include is required.
|
6
|
+
|
7
|
+
A generator is also available for copying relevant images to the public directory.
|
8
|
+
|
9
|
+
./script/generate css_graphs
|
10
|
+
|
11
|
+
== Resources
|
12
|
+
|
13
|
+
Subversion
|
14
|
+
|
15
|
+
* http://topfunky.net/svn/plugins/css_graphs
|
16
|
+
|
17
|
+
Blog
|
18
|
+
|
19
|
+
* http://nubyonrails.com/pages/css_graphs
|
20
|
+
|
21
|
+
Author
|
22
|
+
|
23
|
+
* Geoffrey Grosenbach boss [at] topfunky [dot] com
|
data/Rakefile
ADDED
@@ -0,0 +1,14 @@
|
|
1
|
+
require 'rake'
|
2
|
+
require 'hoe'
|
3
|
+
require 'lib/css_graphs'
|
4
|
+
|
5
|
+
Hoe.new('css_graphs', CssGraphs::VERSION) do |p|
|
6
|
+
p.rubyforge_name = 'seattlerb'
|
7
|
+
p.author = 'Geoffrey Grosenbach'
|
8
|
+
p.email = 'boss AT topfunky.com'
|
9
|
+
p.summary = 'Generates a configurable, CSS-tagged HTML calendar.'
|
10
|
+
p.description = "A simple method to create an HTML calendar for a single month. Can be styled with CSS. Usable with Ruby on Rails."
|
11
|
+
p.url = "http://rubyforge.org/projects/seattlerb"
|
12
|
+
p.changes = p.paragraphs_of('History.txt', 0..1).join("\n\n")
|
13
|
+
p.clean_globs = ['test/output', 'email.txt']
|
14
|
+
end
|
data/about.yml
ADDED
@@ -0,0 +1,7 @@
|
|
1
|
+
author: topfunky
|
2
|
+
summary: A helper to make graphs with CSS and XHTML. Includes a generator for copying relevant images to the public directory.
|
3
|
+
homepage: http://nubyonrails.com/pages/css_graphs
|
4
|
+
plugin: http://topfunky.net/svn/plugins/css_graphs
|
5
|
+
license: MIT
|
6
|
+
version: 0.2
|
7
|
+
rails_version: 1.0+
|
@@ -0,0 +1,15 @@
|
|
1
|
+
class CssGraphsGenerator < Rails::Generator::Base
|
2
|
+
|
3
|
+
def manifest
|
4
|
+
record do |m|
|
5
|
+
css_graphs_dir = File.join("public", "images", "css_graphs")
|
6
|
+
m.directory css_graphs_dir
|
7
|
+
|
8
|
+
Dir.open(File.join(File.dirname(__FILE__), "templates")).entries.each do |file|
|
9
|
+
next if File.directory?(file)
|
10
|
+
m.file file, File.join(css_graphs_dir, file)
|
11
|
+
end
|
12
|
+
|
13
|
+
end
|
14
|
+
end
|
15
|
+
end
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
Binary file
|
data/images/.DS_Store
ADDED
Binary file
|
data/images/colorbar.jpg
ADDED
Binary file
|
data/init.rb
ADDED
data/lib/css_graphs.rb
ADDED
@@ -0,0 +1,371 @@
|
|
1
|
+
module CssGraphs
|
2
|
+
|
3
|
+
VERSION='0.1.0'
|
4
|
+
|
5
|
+
# Makes a vertical bar graph.
|
6
|
+
#
|
7
|
+
# bar_graph [["Stout", 10], ["IPA", 80], ["Pale Ale", 50], ["Milkshake", 30]]
|
8
|
+
#
|
9
|
+
# NOTE: Updated to take an array instead of forcing you to use *array.
|
10
|
+
# NOTE: Normalizes data to fit in the viewable area instead of being fixed to 100.
|
11
|
+
|
12
|
+
def bar_graph(data=[])
|
13
|
+
width = 378
|
14
|
+
height = 150
|
15
|
+
colors = %w(#ce494a #efba29 #efe708 #5a7dd6 #73a25a)
|
16
|
+
floor_cutoff = 24 # Pixels beneath which values will not be drawn in graph
|
17
|
+
data_max = data.inject(0) { |memo, array| array.last > memo ? array.last : memo }
|
18
|
+
|
19
|
+
|
20
|
+
html = <<-"HTML"
|
21
|
+
<style>
|
22
|
+
#vertgraph {
|
23
|
+
width: #{width}px;
|
24
|
+
height: #{height}px;
|
25
|
+
position: relative;
|
26
|
+
background-color: #eeeeee;
|
27
|
+
border: 4px solid #999999;
|
28
|
+
font-family: "Lucida Grande", Verdana, Arial;
|
29
|
+
}
|
30
|
+
|
31
|
+
#vertgraph dl dd {
|
32
|
+
position: absolute;
|
33
|
+
width: 28px;
|
34
|
+
height: 103px;
|
35
|
+
bottom: 34px;
|
36
|
+
padding: 0 !important;
|
37
|
+
margin: 0 !important;
|
38
|
+
background-image: url('/images/css_graphs/colorbar.jpg') no-repeat !important;
|
39
|
+
text-align: center;
|
40
|
+
font-weight: bold;
|
41
|
+
color: white;
|
42
|
+
line-height: 1.5em;
|
43
|
+
}
|
44
|
+
|
45
|
+
#vertgraph dl dt {
|
46
|
+
position: absolute;
|
47
|
+
width: 48px;
|
48
|
+
height: 25px;
|
49
|
+
bottom: 0px;
|
50
|
+
padding: 0 !important;
|
51
|
+
margin: 0 !important;
|
52
|
+
text-align: center;
|
53
|
+
color: #444444;
|
54
|
+
font-size: 0.8em;
|
55
|
+
}
|
56
|
+
HTML
|
57
|
+
|
58
|
+
bar_offset = 24
|
59
|
+
bar_increment = 75
|
60
|
+
bar_image_offset = 28
|
61
|
+
|
62
|
+
data.each_with_index do |d, index|
|
63
|
+
bar_left = bar_offset + (bar_increment * index)
|
64
|
+
label_left = bar_left - 10
|
65
|
+
background_offset = bar_image_offset * index
|
66
|
+
|
67
|
+
html += <<-HTML
|
68
|
+
#vertgraph dl dd.#{d[0].to_s.downcase} { left: #{bar_left}px; background-color: #{colors[index]}; background-position: -#{background_offset}px bottom !important; }
|
69
|
+
#vertgraph dl dt.#{d[0].to_s.downcase} { left: #{label_left}px; background-position: -#{background_offset}px bottom !important; }
|
70
|
+
HTML
|
71
|
+
end
|
72
|
+
|
73
|
+
html += <<-"HTML"
|
74
|
+
</style>
|
75
|
+
<div id="vertgraph">
|
76
|
+
<dl>
|
77
|
+
HTML
|
78
|
+
|
79
|
+
data.each_with_index do |d, index|
|
80
|
+
scaled_value = scale_graph_value(d.last, data_max, 100)
|
81
|
+
html += <<-"HTML"
|
82
|
+
<dt class="#{d.first.to_s.downcase}">#{d[0].to_s.humanize}</dt>
|
83
|
+
<dd class="#{d.first.to_s.downcase}" style="height: #{scaled_value}px;" title="#{d.last}">#{scaled_value < floor_cutoff ? '' : d.last}</dt>
|
84
|
+
HTML
|
85
|
+
end
|
86
|
+
|
87
|
+
html += <<-"HTML"
|
88
|
+
</dl>
|
89
|
+
</div>
|
90
|
+
HTML
|
91
|
+
|
92
|
+
html
|
93
|
+
end
|
94
|
+
|
95
|
+
|
96
|
+
# Makes a vertical bar graph with several sets of bars.
|
97
|
+
#
|
98
|
+
# NOTE: Normalizes data to fit in the viewable area instead of being fixed to 100.
|
99
|
+
#
|
100
|
+
# Example:
|
101
|
+
## <% @data_for_graph = [[['January',10],['February',25],['March',45]],[['January',34],['February',29],['March',80]]] %>
|
102
|
+
## <%= bar_graph (@data_for_graph,{:width => 640,:height => 480}) do |index,variable|
|
103
|
+
## url_for( :action => 'report', :month => index)
|
104
|
+
## end
|
105
|
+
## %>
|
106
|
+
#
|
107
|
+
# alldata should be an array of variables, each one an array itself, of the form:
|
108
|
+
## [['label1',value1],['label2',value2]]
|
109
|
+
#
|
110
|
+
# options hash:
|
111
|
+
#* :display_value_on_bar if set to true, will display the value on top each bar, default behavior is not to show the value
|
112
|
+
#* :colors is an array of colors in hex format: '#EEC2D2' if you don't set them, default colors will be used
|
113
|
+
#* :color_by can be set to 'dimension' or 'index'
|
114
|
+
#* :width and :height set the dimensions, wich default to 378x150
|
115
|
+
#
|
116
|
+
# url_creator_block:
|
117
|
+
#
|
118
|
+
## the url_creator_block receives two parameters, index and variable, that are used to build the bars links.
|
119
|
+
## index is the position for this bar's that in its variable array, while variable is the variable this bar represents
|
120
|
+
|
121
|
+
def multi_bar_graph(alldata=[], options={}, &url_creator)
|
122
|
+
graph_id = (rand*10000000000000000000).to_i.to_s #we need a unique id for each graph on the page so we can have distinct styles for each of them
|
123
|
+
if !options.nil? && options[:width] && options[:height]
|
124
|
+
width,height=options[:width].to_i,options[:height].to_i
|
125
|
+
else
|
126
|
+
width,height = 378,150
|
127
|
+
end
|
128
|
+
colors = (%w(#ce494a #efba29 #efe708 #5a7dd6 #73a25a))*10 unless colors=options[:colors]
|
129
|
+
floor_cutoff = 24 # Pixels beneath which values will not be drawn in graph
|
130
|
+
data_max = (alldata.map { |data| data.max{ |a,b| a.last <=> b.last }.last } ).max
|
131
|
+
dimensions=alldata.size
|
132
|
+
size = alldata.map{ |data| data.size }.max
|
133
|
+
bar_offset = 24 #originally set to 24
|
134
|
+
bar_group_width=(width-bar_offset)/size #originally set to 48px
|
135
|
+
bar_increment = bar_group_width #originally set to 75
|
136
|
+
bar_width=(bar_group_width-bar_offset)/dimensions #originally set to 28px
|
137
|
+
bar_image_offset = bar_offset+4 #originally set to 28
|
138
|
+
bar_padding = 2
|
139
|
+
|
140
|
+
#p "dimensions = #{dimensions}"
|
141
|
+
#p "bar_group_width =#{bar_group_width}"
|
142
|
+
#p "bar_width = #{bar_width}"
|
143
|
+
#p "bar_increment = #{bar_increment}"
|
144
|
+
|
145
|
+
html = <<-"HTML"
|
146
|
+
<style>
|
147
|
+
#vertgraph-#{graph_id} {
|
148
|
+
width: #{width}px;
|
149
|
+
height: #{height}px;
|
150
|
+
position: relative;
|
151
|
+
background-color: #eeeeee;
|
152
|
+
border: 4px solid #999999;
|
153
|
+
font-family: "Lucida Grande", Verdana, Arial;
|
154
|
+
}
|
155
|
+
|
156
|
+
#vertgraph-#{graph_id} dl dd {
|
157
|
+
position: absolute;
|
158
|
+
width: #{bar_width}px;
|
159
|
+
height: #{height-50}px;
|
160
|
+
bottom: 34px;
|
161
|
+
padding: 0 !important;
|
162
|
+
margin: 0 !important;
|
163
|
+
background-image: url('/images/css_graphs/colorbar.jpg') no-repeat !important;
|
164
|
+
text-align: center;
|
165
|
+
font-weight: bold;
|
166
|
+
color: white;
|
167
|
+
line-height: 1.5em;
|
168
|
+
}
|
169
|
+
|
170
|
+
#vertgraph-#{graph_id} dl dt {
|
171
|
+
position: absolute;
|
172
|
+
width: #{bar_group_width}px;
|
173
|
+
height: 25px;
|
174
|
+
bottom: 0px;
|
175
|
+
padding: 0 !important;
|
176
|
+
margin: 0 !important;
|
177
|
+
text-align: center;
|
178
|
+
color: #444444;
|
179
|
+
font-size: 0.8em;
|
180
|
+
}
|
181
|
+
HTML
|
182
|
+
|
183
|
+
alldata.each_with_index do |data,dimension|
|
184
|
+
# p "\n drawing dimension #{dimension}"
|
185
|
+
data.each_with_index do |d, index|
|
186
|
+
# bar_left = bar_offset + (bar_increment * index)
|
187
|
+
bar_group_left = bar_offset + (bar_increment * index)
|
188
|
+
bar_left = bar_group_left + ((bar_width+bar_padding)*dimension)
|
189
|
+
# bar_left = bar_group_left + ( 2*bar_width* (dimension-1))
|
190
|
+
# p "\n bar_left #{bar_left}"
|
191
|
+
label_left = bar_group_left - 10
|
192
|
+
background_offset = ( bar_image_offset * index )
|
193
|
+
if options[:color_by]=='index'
|
194
|
+
color=colors[index]
|
195
|
+
else
|
196
|
+
color=colors[dimension]
|
197
|
+
end
|
198
|
+
html += <<-HTML
|
199
|
+
#vertgraph-#{graph_id} dl dd.a#{index.to_s}#{dimension.to_s} { left: #{bar_left}px; background-color: #{color}; background-position: -#{background_offset}px bottom !important; }
|
200
|
+
#vertgraph-#{graph_id} dl dt.a#{index.to_s}#{dimension.to_s} { left: #{label_left}px; background-position: -#{background_offset}px bottom !important; }
|
201
|
+
HTML
|
202
|
+
end
|
203
|
+
end
|
204
|
+
|
205
|
+
html += <<-"HTML"
|
206
|
+
</style>
|
207
|
+
<div id="vertgraph-#{graph_id}">
|
208
|
+
<dl>
|
209
|
+
HTML
|
210
|
+
alldata.each_with_index do |data,dimension|
|
211
|
+
# data_max = data.inject(0) { |memo, array| array.last > memo ? array.last : memo }
|
212
|
+
data.each_with_index do |d, index|
|
213
|
+
scaled_value = scale_graph_value(d.last, data_max, height-50)
|
214
|
+
if (options[:display_value_on_bar])
|
215
|
+
bar_text=(scaled_value < floor_cutoff ? '' : d.last).to_s #text on top of the bar
|
216
|
+
else
|
217
|
+
bar_text=''
|
218
|
+
end
|
219
|
+
|
220
|
+
if dimension==0
|
221
|
+
html += <<-"HTML"
|
222
|
+
<!-- algo -->
|
223
|
+
<dt class="a#{index.to_s}#{dimension.to_s}" >#{d[0].to_s}</dt>
|
224
|
+
HTML
|
225
|
+
end
|
226
|
+
@url = url_creator.call(index,dimension) if !url_creator.nil?
|
227
|
+
html += <<-"HTML"
|
228
|
+
<a href="#{@url}">
|
229
|
+
<!-- Tooltip for bar group -->
|
230
|
+
<dd class="a#{index.to_s}#{dimension.to_s}" style="height: #{height-50}px;background: none;" title="#{d.last}"></dd>
|
231
|
+
<!-- Color bar -->
|
232
|
+
<dd class="a#{index.to_s}#{dimension.to_s}" style="height: #{scaled_value}px;" title="#{d.last}">#{bar_text}</dd>
|
233
|
+
</a>
|
234
|
+
HTML
|
235
|
+
end
|
236
|
+
end
|
237
|
+
html += <<-"HTML"
|
238
|
+
</dl>
|
239
|
+
</div>
|
240
|
+
HTML
|
241
|
+
|
242
|
+
html
|
243
|
+
end
|
244
|
+
|
245
|
+
# Make a horizontal graph that only shows percentages.
|
246
|
+
#
|
247
|
+
# The label will be set as the title of the bar element.
|
248
|
+
#
|
249
|
+
# horizontal_bar_graph [["Stout", 10], ["IPA", 80], ["Pale Ale", 50], ["Milkshake", 30]]
|
250
|
+
#
|
251
|
+
# NOTE: Updated to take an array instead of forcing you to use *array.
|
252
|
+
# NOTE: Does not normalize data yet...TODO
|
253
|
+
|
254
|
+
def horizontal_bar_graph(data)
|
255
|
+
html = <<-"HTML"
|
256
|
+
<style>
|
257
|
+
/* Basic Bar Graph */
|
258
|
+
.graph {
|
259
|
+
position: relative; /* IE is dumb */
|
260
|
+
width: 200px;
|
261
|
+
border: 1px solid #B1D632;
|
262
|
+
padding: 2px;
|
263
|
+
margin-bottom: .5em;
|
264
|
+
}
|
265
|
+
.graph .bar {
|
266
|
+
display: block;
|
267
|
+
position: relative;
|
268
|
+
background: #B1D632;
|
269
|
+
text-align: center;
|
270
|
+
color: #333;
|
271
|
+
height: 2em;
|
272
|
+
line-height: 2em;
|
273
|
+
}
|
274
|
+
.graph .bar span { position: absolute; left: 1em; } /* This extra markup is necessary because IE does not want to follow the rules for overflow: visible */
|
275
|
+
</style>
|
276
|
+
HTML
|
277
|
+
|
278
|
+
data.each do |d|
|
279
|
+
html += <<-"HTML"
|
280
|
+
<div class="graph">
|
281
|
+
<strong class="bar" style="width: #{d[1]}%;" title="#{d[0].to_s.humanize}"><span>#{d[1]}%</span> </strong>
|
282
|
+
</div>
|
283
|
+
HTML
|
284
|
+
end
|
285
|
+
return html
|
286
|
+
end
|
287
|
+
|
288
|
+
# Makes a multi-colored bar graph with a bar down the middle, representing the value.
|
289
|
+
#
|
290
|
+
# complex_bar_graph [["Stout", 10], ["IPA", 80], ["Pale Ale", 50], ["Milkshake", 30]]
|
291
|
+
#
|
292
|
+
# NOTE: Updated to take an array instead of forcing you to use *array.
|
293
|
+
# NOTE: Does not normalize data yet...TODO
|
294
|
+
|
295
|
+
def complex_bar_graph(data)
|
296
|
+
html = <<-"HTML"
|
297
|
+
<style>
|
298
|
+
/* Complex Bar Graph */
|
299
|
+
div#complex_bar_graph dl {
|
300
|
+
margin: 0;
|
301
|
+
padding: 0;
|
302
|
+
font-family: "Lucida Grande", Verdana, Arial;
|
303
|
+
}
|
304
|
+
div#complex_bar_graph dt {
|
305
|
+
position: relative; /* IE is dumb */
|
306
|
+
clear: both;
|
307
|
+
display: block;
|
308
|
+
float: left;
|
309
|
+
width: 104px;
|
310
|
+
height: 20px;
|
311
|
+
line-height: 20px;
|
312
|
+
margin-right: 17px;
|
313
|
+
font-size: .75em;
|
314
|
+
text-align: right;
|
315
|
+
}
|
316
|
+
div#complex_bar_graph dd {
|
317
|
+
position: relative; /* IE is dumb */
|
318
|
+
display: block;
|
319
|
+
float: left;
|
320
|
+
width: 197px;
|
321
|
+
height: 20px;
|
322
|
+
margin: 0 0 15px;
|
323
|
+
background: url("/images/css_graphs/g_colorbar.jpg");
|
324
|
+
}
|
325
|
+
* html div#complex_bar_graph dd { float: none; } /* IE is dumb; Quick IE hack, apply favorite filter methods for wider browser compatibility */
|
326
|
+
|
327
|
+
div#complex_bar_graph dd div {
|
328
|
+
position: relative;
|
329
|
+
background: url("/images/css_graphs/g_colorbar2.jpg");
|
330
|
+
height: 20px;
|
331
|
+
width: 75%;
|
332
|
+
text-align:right;
|
333
|
+
}
|
334
|
+
div#complex_bar_graph dd div strong {
|
335
|
+
position: absolute;
|
336
|
+
right: -5px;
|
337
|
+
top: -2px;
|
338
|
+
display: block;
|
339
|
+
background: url("/images/css_graphs/g_marker.gif");
|
340
|
+
height: 24px;
|
341
|
+
width: 9px;
|
342
|
+
text-align: left;
|
343
|
+
text-indent: -9999px;
|
344
|
+
overflow: hidden;
|
345
|
+
}
|
346
|
+
</style>
|
347
|
+
<div id="complex_bar_graph">
|
348
|
+
<dl>
|
349
|
+
HTML
|
350
|
+
|
351
|
+
data.each do |d|
|
352
|
+
html += <<-"HTML"
|
353
|
+
<dt class="#{d[0].to_s.downcase}">#{d[0].to_s.humanize}</dt>
|
354
|
+
<dd class="#{d[0].to_s.downcase}" title="#{d[1]}">
|
355
|
+
<div style="width: #{d[1]}%;"><strong>#{d[1]}%</strong></div>
|
356
|
+
</dd>
|
357
|
+
HTML
|
358
|
+
end
|
359
|
+
|
360
|
+
html += "</dl>\n</div>"
|
361
|
+
return html
|
362
|
+
end
|
363
|
+
|
364
|
+
##
|
365
|
+
# Scale values within a +max+. The +max+ will usually be the height of the graph.
|
366
|
+
|
367
|
+
def scale_graph_value(data_value, data_max, max)
|
368
|
+
((data_value.to_f / data_max.to_f) * max).round
|
369
|
+
end
|
370
|
+
|
371
|
+
end
|
@@ -0,0 +1,65 @@
|
|
1
|
+
require 'rubygems'
|
2
|
+
require 'test/unit'
|
3
|
+
require 'fileutils'
|
4
|
+
require 'active_support/core_ext/string/inflections'
|
5
|
+
require File.dirname(__FILE__) + "/../lib/css_graphs"
|
6
|
+
|
7
|
+
# Manually insert this so the helper runs apart from Rails.
|
8
|
+
class String
|
9
|
+
include ActiveSupport::CoreExtensions::String::Inflections
|
10
|
+
end
|
11
|
+
|
12
|
+
class TestCSSGraphs < Test::Unit::TestCase
|
13
|
+
|
14
|
+
include CssGraphs
|
15
|
+
|
16
|
+
def test_bar_graph
|
17
|
+
output = ""
|
18
|
+
data_for_graph = [['January',10],['February',25],['March',45]]
|
19
|
+
|
20
|
+
output += bar_graph(data_for_graph)
|
21
|
+
output += bar_graph(data_for_graph)
|
22
|
+
output += bar_graph(data_for_graph)
|
23
|
+
|
24
|
+
write(output)
|
25
|
+
end
|
26
|
+
|
27
|
+
def test_multi_bar_graph
|
28
|
+
output = ""
|
29
|
+
data_for_graph = [['January',10],['February',25],['March',45]], [['January',34],['February',29],['March',80]]
|
30
|
+
|
31
|
+
output += multi_bar_graph_for_size(data_for_graph, 640, 480)
|
32
|
+
output += multi_bar_graph_for_size(data_for_graph, 300, 100)
|
33
|
+
output += multi_bar_graph_for_size(data_for_graph, 200, 600)
|
34
|
+
|
35
|
+
write(output)
|
36
|
+
end
|
37
|
+
|
38
|
+
def test_horizontal_bar_graph
|
39
|
+
output = horizontal_bar_graph [["Stout", 10], ["IPA", 80], ["Pale Ale", 50], ["Milkshake", 30]]
|
40
|
+
write(output)
|
41
|
+
end
|
42
|
+
|
43
|
+
def test_complex_bar_graph
|
44
|
+
output = complex_bar_graph [["Stout", 10], ["IPA", 80], ["Pale Ale", 50], ["Milkshake", 30]]
|
45
|
+
write(output)
|
46
|
+
end
|
47
|
+
|
48
|
+
private
|
49
|
+
|
50
|
+
def write(data)
|
51
|
+
# Clean up calling method name and use as filename.
|
52
|
+
filename = caller.first.gsub(/\S+\s`/, '').gsub(/'/, '')
|
53
|
+
FileUtils.mkdir_p "test/output"
|
54
|
+
File.open(File.dirname(__FILE__) + "/output/#{filename}.html", "w") do |f|
|
55
|
+
f.write data
|
56
|
+
end
|
57
|
+
end
|
58
|
+
|
59
|
+
def multi_bar_graph_for_size(data, width=640, height=480)
|
60
|
+
multi_bar_graph(data, { :width => width, :height => height }) do |index, variable|
|
61
|
+
"/report/#{index}"
|
62
|
+
end
|
63
|
+
end
|
64
|
+
|
65
|
+
end
|
metadata
ADDED
@@ -0,0 +1,73 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
rubygems_version: 0.9.0
|
3
|
+
specification_version: 1
|
4
|
+
name: css_graphs
|
5
|
+
version: !ruby/object:Gem::Version
|
6
|
+
version: 0.1.0
|
7
|
+
date: 2007-06-24 00:00:00 -07:00
|
8
|
+
summary: Generates a configurable, CSS-tagged HTML calendar.
|
9
|
+
require_paths:
|
10
|
+
- lib
|
11
|
+
email: boss AT topfunky.com
|
12
|
+
homepage: http://rubyforge.org/projects/seattlerb
|
13
|
+
rubyforge_project: seattlerb
|
14
|
+
description: A simple method to create an HTML calendar for a single month. Can be styled with CSS. Usable with Ruby on Rails.
|
15
|
+
autorequire:
|
16
|
+
default_executable:
|
17
|
+
bindir: bin
|
18
|
+
has_rdoc: true
|
19
|
+
required_ruby_version: !ruby/object:Gem::Version::Requirement
|
20
|
+
requirements:
|
21
|
+
- - ">"
|
22
|
+
- !ruby/object:Gem::Version
|
23
|
+
version: 0.0.0
|
24
|
+
version:
|
25
|
+
platform: ruby
|
26
|
+
signing_key:
|
27
|
+
cert_chain:
|
28
|
+
post_install_message:
|
29
|
+
authors:
|
30
|
+
- Geoffrey Grosenbach
|
31
|
+
files:
|
32
|
+
- History.txt
|
33
|
+
- MIT-LICENSE
|
34
|
+
- Manifest.txt
|
35
|
+
- README.txt
|
36
|
+
- Rakefile
|
37
|
+
- about.yml
|
38
|
+
- generators/css_graphs/css_graphs_generator.rb
|
39
|
+
- generators/css_graphs/templates/.DS_Store
|
40
|
+
- generators/css_graphs/templates/colorbar.jpg
|
41
|
+
- generators/css_graphs/templates/g_colorbar.jpg
|
42
|
+
- generators/css_graphs/templates/g_colorbar2.jpg
|
43
|
+
- generators/css_graphs/templates/g_marker.gif
|
44
|
+
- images/.DS_Store
|
45
|
+
- images/colorbar.jpg
|
46
|
+
- init.rb
|
47
|
+
- lib/css_graphs.rb
|
48
|
+
- test/test_css_graphs.rb
|
49
|
+
test_files:
|
50
|
+
- test/test_css_graphs.rb
|
51
|
+
rdoc_options:
|
52
|
+
- --main
|
53
|
+
- README.txt
|
54
|
+
extra_rdoc_files:
|
55
|
+
- History.txt
|
56
|
+
- Manifest.txt
|
57
|
+
- README.txt
|
58
|
+
executables: []
|
59
|
+
|
60
|
+
extensions: []
|
61
|
+
|
62
|
+
requirements: []
|
63
|
+
|
64
|
+
dependencies:
|
65
|
+
- !ruby/object:Gem::Dependency
|
66
|
+
name: hoe
|
67
|
+
version_requirement:
|
68
|
+
version_requirements: !ruby/object:Gem::Version::Requirement
|
69
|
+
requirements:
|
70
|
+
- - ">="
|
71
|
+
- !ruby/object:Gem::Version
|
72
|
+
version: 1.2.1
|
73
|
+
version:
|