ruby-treemap-fork 0.0.4
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +15 -0
- data/COPYING +340 -0
- data/ChangeLog +18 -0
- data/EXAMPLES +48 -0
- data/README +48 -0
- data/Rakefile +69 -0
- data/TODO +6 -0
- data/lib/treemap.rb +66 -0
- data/lib/treemap/color_base.rb +61 -0
- data/lib/treemap/gradient_color.rb +71 -0
- data/lib/treemap/html_output.rb +173 -0
- data/lib/treemap/image_output.rb +77 -0
- data/lib/treemap/layout_base.rb +30 -0
- data/lib/treemap/node.rb +140 -0
- data/lib/treemap/output_base.rb +39 -0
- data/lib/treemap/rectangle.rb +38 -0
- data/lib/treemap/slice_layout.rb +97 -0
- data/lib/treemap/squarified_layout.rb +141 -0
- data/lib/treemap/svg_output.rb +115 -0
- data/test/color_test.html +1 -0
- data/test/html_test.html +14 -0
- data/test/tc_color.rb +17 -0
- data/test/tc_html.rb +22 -0
- data/test/tc_simple.rb +30 -0
- data/test/tc_slice.rb +25 -0
- data/test/tc_squarified.rb +25 -0
- data/test/tc_svg.rb +21 -0
- data/test/test_base.rb +39 -0
- metadata +74 -0
@@ -0,0 +1,115 @@
|
|
1
|
+
#
|
2
|
+
# svg_output.rb - RubyTreemap
|
3
|
+
#
|
4
|
+
# Copyright (c) 2006 by Andrew Bruno <aeb@qnot.org>
|
5
|
+
#
|
6
|
+
# This program is free software; you can redistribute it and/or modify
|
7
|
+
# it under the terms of the GNU General Public License as published by
|
8
|
+
# the Free Software Foundation; either version 2 of the License, or
|
9
|
+
# (at your option) any later version.
|
10
|
+
#
|
11
|
+
#
|
12
|
+
|
13
|
+
require 'cgi'
|
14
|
+
|
15
|
+
require File.dirname(__FILE__) + "/output_base"
|
16
|
+
|
17
|
+
class Treemap::SvgOutput < Treemap::OutputBase
|
18
|
+
|
19
|
+
def initialize
|
20
|
+
super
|
21
|
+
|
22
|
+
yield self if block_given?
|
23
|
+
end
|
24
|
+
|
25
|
+
def node_label(node)
|
26
|
+
CGI.escapeHTML(node.label)
|
27
|
+
end
|
28
|
+
|
29
|
+
def draw_node_body(node)
|
30
|
+
draw_label(node)
|
31
|
+
end
|
32
|
+
|
33
|
+
def draw_label(node)
|
34
|
+
# center label in box
|
35
|
+
label = ""
|
36
|
+
label += "<text style=\"text-anchor: middle\" font-size=\"15\""
|
37
|
+
label += " x=\"" + (node.bounds.x1 + node.bounds.width / 2).to_s + "\""
|
38
|
+
label += " y=\"" + (node.bounds.y1 + node.bounds.height / 2).to_s + "\">"
|
39
|
+
label += node_label(node)
|
40
|
+
label += "</text>\n"
|
41
|
+
|
42
|
+
label
|
43
|
+
end
|
44
|
+
|
45
|
+
def node_color(node)
|
46
|
+
color = "#CCCCCC"
|
47
|
+
|
48
|
+
if(!node.color.nil?)
|
49
|
+
if(not Numeric === node.color)
|
50
|
+
color = node.color
|
51
|
+
else
|
52
|
+
color = "#" + @color.get_hex_color(node.color)
|
53
|
+
end
|
54
|
+
end
|
55
|
+
|
56
|
+
color
|
57
|
+
end
|
58
|
+
|
59
|
+
def to_png(node, filename="treemap.png")
|
60
|
+
require 'RMagick'
|
61
|
+
|
62
|
+
svg = to_svg(node)
|
63
|
+
img = Magick::Image.from_blob(svg) { self.format = "SVG" }
|
64
|
+
img[0].write(filename)
|
65
|
+
end
|
66
|
+
|
67
|
+
def to_svg(node)
|
68
|
+
bounds = self.bounds
|
69
|
+
|
70
|
+
@layout.process(node, bounds)
|
71
|
+
|
72
|
+
draw_map(node)
|
73
|
+
end
|
74
|
+
|
75
|
+
def draw_map(node)
|
76
|
+
svg = "<svg"
|
77
|
+
svg += " xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\""
|
78
|
+
svg += " xmlns:ev=\"http://www.w3.org/2001/xml-events\""
|
79
|
+
svg += " width=\"" + (node.bounds.width).to_s + "\" height=\"" + (node.bounds.height).to_s + "\">"
|
80
|
+
|
81
|
+
svg += draw_node(node)
|
82
|
+
svg += "</svg>"
|
83
|
+
svg
|
84
|
+
end
|
85
|
+
|
86
|
+
def draw_node(node)
|
87
|
+
return "" if node.bounds.nil?
|
88
|
+
|
89
|
+
svg = ""
|
90
|
+
svg += "<rect"
|
91
|
+
svg += " id=\"rect-" + node.id.to_s + "\""
|
92
|
+
svg += " x=\"" + node.bounds.x1.to_s + "\""
|
93
|
+
svg += " y=\"" + node.bounds.y1.to_s + "\""
|
94
|
+
svg += " width=\"" + node.bounds.width.to_s + "\""
|
95
|
+
svg += " height=\"" + node.bounds.height.to_s + "\""
|
96
|
+
#svg += " style=\""
|
97
|
+
#svg += " fill: " + node_color(node) + ";"
|
98
|
+
#svg += " stroke: #000000;"
|
99
|
+
#svg += " stroke-width: 1px;"
|
100
|
+
svg += " fill=\"" + node_color(node) + "\""
|
101
|
+
svg += " stroke=\"#000000\""
|
102
|
+
svg += " stroke-width=\"1px\""
|
103
|
+
svg += " />\n"
|
104
|
+
|
105
|
+
svg += draw_node_body(node)
|
106
|
+
|
107
|
+
if(!node.children.nil? and node.children.size > 0)
|
108
|
+
node.children.each do |c|
|
109
|
+
svg += draw_node(c)
|
110
|
+
end
|
111
|
+
end
|
112
|
+
|
113
|
+
svg
|
114
|
+
end
|
115
|
+
end
|
@@ -0,0 +1 @@
|
|
1
|
+
<div><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EC6F70;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EB6F71;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EB7071;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EB7072;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EB7172;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EB7173;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EB7273;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EB7274;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EB7374;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EB7375;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EB7475;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EB7476;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EB7576;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EA7577;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EA7678;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EA7678;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EA7779;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EA7879;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EA787A;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EA797A;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EA797B;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EA7A7B;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EA7A7C;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EA7B7C;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #EA7B7D;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E97C7E;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E97C7E;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E97D7F;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E97D7F;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E97E80;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E97E80;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E97F81;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E98081;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E98082;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E98182;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E98183;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E98283;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E88284;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E88385;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E88385;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E88486;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E88486;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E88587;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E88587;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E88688;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E88688;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E88789;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E88889;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E8888A;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E7898A;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E7898B;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E78A8C;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E78A8C;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E78B8D;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E78B8D;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E78C8E;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E78C8E;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E78D8F;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E78D8F;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E78E90;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E78E90;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E68F91;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E69091;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E69092;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E69193;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E69193;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E69294;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E69294;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E69395;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E69395;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E69496;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E69496;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E69597;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E59597;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E59698;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E59699;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E59799;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E5989A;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E5989A;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E5999B;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E5999B;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E59A9C;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E59A9C;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E59B9D;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E59B9D;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E49C9E;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E49C9E;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E49D9F;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E49DA0;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E49EA0;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E49EA1;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E49FA1;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E49FA2;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E4A0A2;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E4A1A3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E4A1A3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E4A2A4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E3A2A4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E3A3A5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E3A3A5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E3A4A6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E3A4A7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E3A5A7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E3A5A8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E3A6A8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E3A6A9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E3A7A9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E3A7AA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E3A8AA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E3A9AB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E2A9AB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E2AAAC;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E2AAAC;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E2ABAD;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E2ABAE;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E2ACAE;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E2ACAF;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E2ADAF;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E2ADB0;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E2AEB0;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E2AEB1;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E2AFB1;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E1AFB2;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E1B0B2;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E1B1B3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E1B1B4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E1B2B4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E1B2B5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E1B3B5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E1B3B6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E1B4B6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E1B4B7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E1B5B7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E1B5B8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E0B6B8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E0B6B9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E0B7B9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E0B7BA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E0B8BB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E0B9BB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E0B9BC;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E0BABC;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E0BABD;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E0BBBD;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E0BBBE;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #E0BCBE;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DFBCBF;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DFBDBF;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DFBDC0;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DFBEC0;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DFBEC1;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DFBFC2;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DFBFC2;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DFC0C3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DFC1C3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DFC1C4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DFC2C4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DFC2C5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DEC3C5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DEC3C6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DEC4C6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DEC4C7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DEC5C7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DEC5C8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DEC6C9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DEC6C9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DEC7CA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DEC7CA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DEC8CB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DEC8CB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DDC9CC;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DDCACC;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DDCACD;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DDCBCD;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DDCBCE;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DDCCCF;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DDCCCF;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DDCDD0;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DDCDD0;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DDCED1;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DDCED1;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DDCFD2;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DCCFD2;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DCD0D3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DCD0D3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DCD1D4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DCD2D4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DCD2D5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DCD3D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DCD3D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DCD4D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DCD4D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DCD5D8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DCD5D8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DBD6D9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DBD6D9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DBD7DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DBD7DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DBD8DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DBD8DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DBD9DC;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DAD9DC;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #DAD9DC;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D9D8DC;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D9D8DC;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D8D8DC;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D8D8DC;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D7D8DC;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D7D8DC;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D6D7DC;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D6D7DC;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D5D7DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D4D7DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D4D7DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D3D7DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D3D6DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D2D6DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D2D6DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D1D6DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D1D6DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D0D5DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #D0D5DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #CFD5DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #CED5DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #CED5DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #CDD5DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #CDD4DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #CCD4DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #CCD4DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #CBD4DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #CBD4DB;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #CAD3DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C9D3DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C9D3DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C8D3DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C8D3DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C7D3DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C7D2DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C6D2DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C6D2DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C5D2DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C5D2DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C4D2DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C3D1DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C3D1DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C2D1DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C2D1DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C1D1DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C1D0DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C0D0DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #C0D0DA;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #BFD0D9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #BFD0D9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #BED0D9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #BDCFD9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #BDCFD9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #BCCFD9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #BCCFD9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #BBCFD9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #BBCFD9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #BACED9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #BACED9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B9CED9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B9CED9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B8CED9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B7CDD9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B7CDD9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B6CDD9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B6CDD9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B5CDD9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B5CDD9;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B4CCD8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B4CCD8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B3CCD8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B2CCD8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B2CCD8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B1CCD8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B1CBD8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B0CBD8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #B0CBD8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #AFCBD8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #AFCBD8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #AECAD8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #AECAD8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #ADCAD8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #ACCAD8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #ACCAD8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #ABCAD8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #ABC9D8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #AAC9D8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #AAC9D8;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A9C9D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A9C9D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A8C8D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A8C8D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A7C8D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A6C8D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A6C8D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A5C8D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A5C7D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A4C7D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A4C7D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A3C7D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A3C7D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A2C7D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A2C6D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A1C6D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A0C6D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #A0C6D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #9FC6D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #9FC5D7;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #9EC5D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #9EC5D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #9DC5D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #9DC5D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #9CC5D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #9BC4D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #9BC4D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #9AC4D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #9AC4D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #99C4D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #99C4D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #98C3D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #98C3D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #97C3D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #97C3D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #96C3D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #95C2D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #95C2D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #94C2D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #94C2D6;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #93C2D5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #93C2D5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #92C1D5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #92C1D5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #91C1D5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #91C1D5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #90C1D5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #8FC1D5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #8FC0D5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #8EC0D5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #8EC0D5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #8DC0D5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #8DC0D5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #8CBFD5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #8CBFD5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #8BBFD5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #8BBFD5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #8ABFD5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #89BFD5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #89BED5;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #88BED4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #88BED4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #87BED4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #87BED4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #86BDD4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #86BDD4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #85BDD4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #84BDD4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #84BDD4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #83BDD4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #83BCD4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #82BCD4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #82BCD4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #81BCD4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #81BCD4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #80BCD4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #80BBD4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #7FBBD4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #7EBBD4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #7EBBD4;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #7DBBD3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #7DBAD3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #7CBAD3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #7CBAD3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #7BBAD3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #7BBAD3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #7ABAD3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #7AB9D3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #79B9D3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #78B9D3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #78B9D3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #77B9D3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #77B9D3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #76B8D3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #76B8D3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #75B8D3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #75B8D3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #74B8D3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #74B7D3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #73B7D3;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #72B7D2;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #72B7D2;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #71B7D2;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #71B7D2;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #70B6D2;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #70B6D2;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #6FB6D2;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #6FB6D2;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #6EB6D2;"><img width="1" height="1" /></span><span style="display: block; float: left;width: 1px;height: 20px;background-color: #6EB6D2;"><img width="1" height="1" /></span></div>
|
data/test/html_test.html
ADDED
@@ -0,0 +1,14 @@
|
|
1
|
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html><head><title>Treemap - all</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><style type="text/css">.node {
|
2
|
+
border: 1px solid black;
|
3
|
+
}
|
4
|
+
.label {
|
5
|
+
color: #FFFFFF;
|
6
|
+
font-size: 11px;
|
7
|
+
}
|
8
|
+
.label-heading {
|
9
|
+
color: #FFFFFF;
|
10
|
+
font-size: 14pt;
|
11
|
+
font-weight: bold;
|
12
|
+
text-decoration: underline;
|
13
|
+
}
|
14
|
+
</style></head><body><div id="node-1" style="overflow: hidden; position: absolute; display: inline;left: 0px; top: 0px;width: 800px; height: 600px;background-color: #CCCCCC;" class="node treemap-root"><span class="label" style="font-size:77px">all</span><div id="node-10" style="overflow: hidden; position: absolute; display: inline;left: 0px; top: 0px;width: 560px; height: 600px;background-color: #CCCCCC;border: 1px solid black;" class="node"><span style="overflow: hidden; position: absolute;margin-top: 268px;left: 0px; top: 0px; width: 100%; height: 100%; line-height: 100%; text-align: center;z-index: 100;font-size:64px;" class="label-heading">Child4</span><div id="node-12" style="overflow: hidden; position: absolute; display: inline;left: 0px; top: 0px;width: 345px; height: 557px;background-color: #CCCCCC;" class="node"><span class="label" style="font-size:49px">Child4-40</span></div><div id="node-13" style="overflow: hidden; position: absolute; display: inline;left: 345px; top: 0px;width: 215px; height: 557px;background-color: #CCCCCC;" class="node"><span class="label" style="font-size:38px">Child5</span><div id="node-16" style="overflow: hidden; position: absolute; display: inline;left: 0px; top: 0px;width: 215px; height: 245px;background-color: #CCCCCC;" class="node"><span class="label" style="font-size:25px">Child5-11</span></div><div id="node-15" style="overflow: hidden; position: absolute; display: inline;left: 0px; top: 245px;width: 215px; height: 178px;background-color: #CCCCCC;" class="node"><span class="label" style="font-size:21px">Child5-8</span></div><div id="node-14" style="overflow: hidden; position: absolute; display: inline;left: 0px; top: 423px;width: 215px; height: 134px;background-color: #CCCCCC;" class="node"><span class="label" style="font-size:19px">Child5-6</span></div></div><div id="node-11" style="overflow: hidden; position: absolute; display: inline;left: 0px; top: 557px;width: 560px; height: 43px;background-color: #CCCCCC;" class="node"><span class="label" style="font-size:17px">Child4-5</span></div></div><div id="node-2" style="overflow: hidden; position: absolute; display: inline;left: 560px; top: 0px;width: 240px; height: 240px;background-color: #CCCCCC;border: 1px solid black;" class="node"><span style="overflow: hidden; position: absolute;margin-top: 107px;left: 0px; top: 0px; width: 100%; height: 100%; line-height: 100%; text-align: center;z-index: 100;font-size:26px;" class="label-heading">Child1</span></div><div id="node-4" style="overflow: hidden; position: absolute; display: inline;left: 560px; top: 240px;width: 240px; height: 200px;background-color: #CCCCCC;border: 1px solid black;" class="node"><span style="overflow: hidden; position: absolute;margin-top: 88px;left: 0px; top: 0px; width: 100%; height: 100%; line-height: 100%; text-align: center;z-index: 100;font-size:24px;" class="label-heading">Child3</span><div id="node-8" style="overflow: hidden; position: absolute; display: inline;left: 0px; top: 0px;width: 103px; height: 140px;background-color: #CCCCCC;" class="node"><span class="label" style="font-size:13px">Child3-3</span></div><div id="node-6" style="overflow: hidden; position: absolute; display: inline;left: 103px; top: 0px;width: 69px; height: 140px;background-color: #CCCCCC;" class="node"><span class="label" style="font-size:11px">Child3-2</span></div><div id="node-5" style="overflow: hidden; position: absolute; display: inline;left: 172px; top: 0px;width: 68px; height: 140px;background-color: #CCCCCC;" class="node"><span class="label" style="font-size:10px">Child3-2</span></div><div id="node-7" style="overflow: hidden; position: absolute; display: inline;left: 0px; top: 140px;width: 160px; height: 60px;background-color: #CCCCCC;" class="node"><span class="label" style="font-size:10px">Child3-2</span></div><div id="node-9" style="overflow: hidden; position: absolute; display: inline;left: 160px; top: 140px;width: 80px; height: 60px;background-color: #CCCCCC;" class="node"><span class="label" style="font-size:7px">Child3-1</span></div></div><div id="node-3" style="overflow: hidden; position: absolute; display: inline;left: 560px; top: 440px;width: 240px; height: 160px;background-color: #CCCCCC;border: 1px solid black;" class="node"><span style="overflow: hidden; position: absolute;margin-top: 70px;left: 0px; top: 0px; width: 100%; height: 100%; line-height: 100%; text-align: center;z-index: 100;font-size:21px;" class="label-heading">Child2</span></div></div></body></html>
|
data/test/tc_color.rb
ADDED
@@ -0,0 +1,17 @@
|
|
1
|
+
|
2
|
+
require "test_base"
|
3
|
+
|
4
|
+
class TestColor < Test::Unit::TestCase
|
5
|
+
def test_color
|
6
|
+
g = Treemap::GradientColor.new do |g|
|
7
|
+
g.min_color = "FC0404"
|
8
|
+
g.mean_color = "DBD9DC"
|
9
|
+
g.max_color = "0092C8"
|
10
|
+
g.increment = 0.5
|
11
|
+
end
|
12
|
+
|
13
|
+
File.open(File.dirname(__FILE__) + '/color_test.html', "w") do |f|
|
14
|
+
f.puts g.to_html
|
15
|
+
end
|
16
|
+
end
|
17
|
+
end
|
data/test/tc_html.rb
ADDED
@@ -0,0 +1,22 @@
|
|
1
|
+
|
2
|
+
require "test_base"
|
3
|
+
|
4
|
+
class TestHTMLOutput < Test::Unit::TestCase
|
5
|
+
include TestTreemapBase
|
6
|
+
|
7
|
+
def setup
|
8
|
+
@root = setup_root
|
9
|
+
end
|
10
|
+
|
11
|
+
def test_html_output
|
12
|
+
output = Treemap::HtmlOutput.new do |o|
|
13
|
+
o.width = 800
|
14
|
+
o.height = 600
|
15
|
+
o.center_labels_at_depth = 1
|
16
|
+
end
|
17
|
+
|
18
|
+
File.open(File.dirname(__FILE__) + '/html_test.html', "w") do |f|
|
19
|
+
f.puts output.to_html(@root)
|
20
|
+
end
|
21
|
+
end
|
22
|
+
end
|
data/test/tc_simple.rb
ADDED
@@ -0,0 +1,30 @@
|
|
1
|
+
|
2
|
+
require "test_base"
|
3
|
+
|
4
|
+
class TestSimple < Test::Unit::TestCase
|
5
|
+
def setup
|
6
|
+
@root = Treemap::Node.new
|
7
|
+
@root.new_child(:size => 6)
|
8
|
+
@root.new_child(:size => 6)
|
9
|
+
@root.new_child(:size => 4)
|
10
|
+
@root.new_child(:size => 3)
|
11
|
+
@root.new_child(:size => 2)
|
12
|
+
@root.new_child(:size => 2)
|
13
|
+
@root.new_child(:size => 1)
|
14
|
+
end
|
15
|
+
|
16
|
+
def test_simple
|
17
|
+
output = Treemap::ImageOutput.new do |o|
|
18
|
+
o.width = 600
|
19
|
+
o.height = 400
|
20
|
+
o.layout = Treemap::SquarifiedLayout.new
|
21
|
+
end
|
22
|
+
|
23
|
+
bounds = Treemap::Rectangle.new(0, 0, 600, 400)
|
24
|
+
output.layout.process(@root, bounds)
|
25
|
+
|
26
|
+
Treemap::dump_tree(@root)
|
27
|
+
|
28
|
+
output.to_png(@root, File.dirname(__FILE__) + '/simple_test.png')
|
29
|
+
end
|
30
|
+
end
|
data/test/tc_slice.rb
ADDED
@@ -0,0 +1,25 @@
|
|
1
|
+
|
2
|
+
require "test_base"
|
3
|
+
|
4
|
+
class TestSlice < Test::Unit::TestCase
|
5
|
+
include TestTreemapBase
|
6
|
+
|
7
|
+
def setup
|
8
|
+
@root = setup_root
|
9
|
+
end
|
10
|
+
|
11
|
+
def test_slice
|
12
|
+
output = Treemap::ImageOutput.new do |o|
|
13
|
+
o.width = 800
|
14
|
+
o.height = 600
|
15
|
+
o.layout = Treemap::SliceLayout.new
|
16
|
+
end
|
17
|
+
|
18
|
+
output.to_png(@root, File.dirname(__FILE__) + '/slice_test.png')
|
19
|
+
|
20
|
+
bounds = Treemap::Rectangle.new(0, 0, 800, 600)
|
21
|
+
output.layout.process(@root, bounds)
|
22
|
+
|
23
|
+
Treemap::dump_tree(@root)
|
24
|
+
end
|
25
|
+
end
|
@@ -0,0 +1,25 @@
|
|
1
|
+
|
2
|
+
require "test_base"
|
3
|
+
|
4
|
+
class TestSquarified < Test::Unit::TestCase
|
5
|
+
include TestTreemapBase
|
6
|
+
|
7
|
+
def setup
|
8
|
+
@root = setup_root
|
9
|
+
end
|
10
|
+
|
11
|
+
def test_squarified
|
12
|
+
output = Treemap::ImageOutput.new do |o|
|
13
|
+
o.width = 800
|
14
|
+
o.height = 600
|
15
|
+
o.layout = Treemap::SquarifiedLayout.new
|
16
|
+
end
|
17
|
+
|
18
|
+
output.to_png(@root, File.dirname(__FILE__) + '/squarified_test.png')
|
19
|
+
|
20
|
+
bounds = Treemap::Rectangle.new(0, 0, 800, 600)
|
21
|
+
output.layout.process(@root, bounds)
|
22
|
+
|
23
|
+
Treemap::dump_tree(@root)
|
24
|
+
end
|
25
|
+
end
|
data/test/tc_svg.rb
ADDED
@@ -0,0 +1,21 @@
|
|
1
|
+
|
2
|
+
require "test_base"
|
3
|
+
|
4
|
+
class TestSvgOutput < Test::Unit::TestCase
|
5
|
+
include TestTreemapBase
|
6
|
+
|
7
|
+
def setup
|
8
|
+
@root = setup_root
|
9
|
+
end
|
10
|
+
|
11
|
+
def test_svg_output
|
12
|
+
output = Treemap::SvgOutput.new do |o|
|
13
|
+
o.width = 800
|
14
|
+
o.height = 600
|
15
|
+
end
|
16
|
+
|
17
|
+
File.open(File.dirname(__FILE__) + '/svg_test.svg', "w") do |f|
|
18
|
+
f.puts output.to_svg(@root)
|
19
|
+
end
|
20
|
+
end
|
21
|
+
end
|
data/test/test_base.rb
ADDED
@@ -0,0 +1,39 @@
|
|
1
|
+
|
2
|
+
require "test/unit"
|
3
|
+
require "treemap"
|
4
|
+
begin
|
5
|
+
require "RMagick"
|
6
|
+
require "treemap/image_output"
|
7
|
+
require "treemap/svg_output"
|
8
|
+
rescue LoadError
|
9
|
+
end
|
10
|
+
|
11
|
+
module TestTreemapBase
|
12
|
+
def setup_root
|
13
|
+
root = Treemap::Node.new(:size => 100, :label => "all")
|
14
|
+
|
15
|
+
root.new_child(:size => 12, :label => "Child1")
|
16
|
+
root.new_child(:size => 8, :label => "Child2")
|
17
|
+
|
18
|
+
child3 = Treemap::Node.new(:size => 10, :label => "Child3")
|
19
|
+
[2,2,2,3,1].each do |n|
|
20
|
+
child3.new_child(:size => n, :label => "Child3-"+n.to_s)
|
21
|
+
end
|
22
|
+
root.add_child(child3)
|
23
|
+
|
24
|
+
child4 = Treemap::Node.new(:size => 70, :label => "Child4")
|
25
|
+
[5, 40].each do |n|
|
26
|
+
child4.new_child(:size => n, :label => "Child4-"+n.to_s)
|
27
|
+
end
|
28
|
+
|
29
|
+
child5 = Treemap::Node.new(:size => 25, :label => "Child5")
|
30
|
+
[6,8,11].each do |n|
|
31
|
+
child5.new_child(:size => n, :label => "Child5-"+n.to_s)
|
32
|
+
end
|
33
|
+
|
34
|
+
child4.add_child(child5)
|
35
|
+
root.add_child(child4)
|
36
|
+
|
37
|
+
root
|
38
|
+
end
|
39
|
+
end
|
metadata
ADDED
@@ -0,0 +1,74 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
name: ruby-treemap-fork
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
version: 0.0.4
|
5
|
+
platform: ruby
|
6
|
+
authors:
|
7
|
+
- Andrew Bruno
|
8
|
+
autorequire: treemap
|
9
|
+
bindir: bin
|
10
|
+
cert_chain: []
|
11
|
+
date: 2013-07-26 00:00:00.000000000 Z
|
12
|
+
dependencies: []
|
13
|
+
description: Treemap visualization in ruby
|
14
|
+
email: aeb@qnot.org
|
15
|
+
executables: []
|
16
|
+
extensions: []
|
17
|
+
extra_rdoc_files:
|
18
|
+
- README
|
19
|
+
- EXAMPLES
|
20
|
+
files:
|
21
|
+
- Rakefile
|
22
|
+
- TODO
|
23
|
+
- EXAMPLES
|
24
|
+
- README
|
25
|
+
- ChangeLog
|
26
|
+
- COPYING
|
27
|
+
- lib/treemap/color_base.rb
|
28
|
+
- lib/treemap/gradient_color.rb
|
29
|
+
- lib/treemap/html_output.rb
|
30
|
+
- lib/treemap/image_output.rb
|
31
|
+
- lib/treemap/layout_base.rb
|
32
|
+
- lib/treemap/node.rb
|
33
|
+
- lib/treemap/output_base.rb
|
34
|
+
- lib/treemap/rectangle.rb
|
35
|
+
- lib/treemap/slice_layout.rb
|
36
|
+
- lib/treemap/squarified_layout.rb
|
37
|
+
- lib/treemap/svg_output.rb
|
38
|
+
- lib/treemap.rb
|
39
|
+
- test/color_test.html
|
40
|
+
- test/html_test.html
|
41
|
+
- test/tc_color.rb
|
42
|
+
- test/tc_html.rb
|
43
|
+
- test/tc_simple.rb
|
44
|
+
- test/tc_slice.rb
|
45
|
+
- test/tc_squarified.rb
|
46
|
+
- test/tc_svg.rb
|
47
|
+
- test/test_base.rb
|
48
|
+
homepage: http://rubytreemap.rubyforge.org/
|
49
|
+
licenses: []
|
50
|
+
metadata: {}
|
51
|
+
post_install_message:
|
52
|
+
rdoc_options:
|
53
|
+
- --main
|
54
|
+
- README
|
55
|
+
require_paths:
|
56
|
+
- lib
|
57
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
58
|
+
requirements:
|
59
|
+
- - ! '>='
|
60
|
+
- !ruby/object:Gem::Version
|
61
|
+
version: '0'
|
62
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
63
|
+
requirements:
|
64
|
+
- - ! '>='
|
65
|
+
- !ruby/object:Gem::Version
|
66
|
+
version: '0'
|
67
|
+
requirements:
|
68
|
+
- none
|
69
|
+
rubyforge_project:
|
70
|
+
rubygems_version: 2.0.5
|
71
|
+
signing_key:
|
72
|
+
specification_version: 4
|
73
|
+
summary: Treemap visualization in ruby
|
74
|
+
test_files: []
|