scruffy 0.2.2 → 0.2.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (84) hide show
  1. data/CHANGES +8 -0
  2. data/History.txt +104 -0
  3. data/License.txt +20 -0
  4. data/Manifest.txt +105 -0
  5. data/PostInstall.txt +6 -0
  6. data/README.txt +66 -0
  7. data/Rakefile +108 -104
  8. data/config/hoe.rb +78 -0
  9. data/config/requirements.rb +15 -0
  10. data/lib/scruffy.rb +8 -6
  11. data/lib/scruffy/components/base.rb +4 -0
  12. data/lib/scruffy/components/legend.rb +65 -30
  13. data/lib/scruffy/components/viewport.rb +14 -17
  14. data/lib/scruffy/formatters.rb +1 -1
  15. data/lib/scruffy/graph.rb +18 -7
  16. data/lib/scruffy/graph_state.rb +24 -0
  17. data/lib/scruffy/helpers.rb +2 -1
  18. data/lib/scruffy/helpers/canvas.rb +19 -17
  19. data/lib/scruffy/helpers/layer_container.rb +8 -3
  20. data/lib/scruffy/helpers/meta.rb +5 -5
  21. data/lib/scruffy/helpers/point_container.rb +70 -0
  22. data/lib/scruffy/layers.rb +2 -0
  23. data/lib/scruffy/layers/average.rb +6 -1
  24. data/lib/scruffy/layers/bar.rb +1 -0
  25. data/lib/scruffy/layers/base.rb +38 -14
  26. data/lib/scruffy/layers/pie.rb +123 -0
  27. data/lib/scruffy/layers/pie_slice.rb +114 -0
  28. data/lib/scruffy/layers/scatter.rb +21 -0
  29. data/lib/scruffy/layers/sparkline_bar.rb +1 -0
  30. data/lib/scruffy/layers/stacked.rb +2 -5
  31. data/lib/scruffy/rasterizers/rmagick_rasterizer.rb +1 -2
  32. data/lib/scruffy/renderers.rb +2 -1
  33. data/lib/scruffy/renderers/base.rb +6 -4
  34. data/lib/scruffy/renderers/pie.rb +20 -0
  35. data/lib/scruffy/themes.rb +54 -4
  36. data/lib/scruffy/version.rb +8 -2
  37. data/script/console +10 -0
  38. data/script/destroy +14 -0
  39. data/script/generate +14 -0
  40. data/script/txt2html +82 -0
  41. data/setup.rb +1585 -0
  42. data/spec/scruffy/graph_spec.rb +175 -0
  43. data/spec/scruffy/layers/base_spec.rb +30 -0
  44. data/spec/{layers → scruffy/layers}/line_spec.rb +2 -1
  45. data/spec/spec_helper.rb +8 -0
  46. data/tasks/deployment.rake +34 -0
  47. data/tasks/environment.rake +7 -0
  48. data/tasks/website.rake +17 -0
  49. data/test/graph_creation_test.rb +101 -0
  50. data/test/test_helper.rb +2 -0
  51. data/test/test_scruffy.rb +11 -0
  52. data/website/images/blank.gif.html +7 -0
  53. data/website/images/graphs/all_smiles.png +0 -0
  54. data/website/images/graphs/bar_test.png +0 -0
  55. data/website/images/graphs/bar_test.svg +71 -0
  56. data/website/images/graphs/line_test.png +0 -0
  57. data/website/images/graphs/line_test.svg +60 -0
  58. data/website/images/graphs/multi_test.png +0 -0
  59. data/website/images/graphs/multi_test.svg +296 -0
  60. data/website/images/graphs/pie_test.png +0 -0
  61. data/website/images/graphs/pie_test.svg +40 -0
  62. data/website/images/graphs/split_test.png +0 -0
  63. data/website/images/graphs/split_test.svg +295 -0
  64. data/website/images/graphs/stacking_test.png +0 -0
  65. data/website/images/graphs/stacking_test.svg +146 -0
  66. data/website/images/header.png +0 -0
  67. data/website/images/header_gradient.png +0 -0
  68. data/website/images/overlay.png +0 -0
  69. data/website/images/scruffy.png +0 -0
  70. data/website/index.html +294 -0
  71. data/website/index.txt +199 -0
  72. data/website/javascripts/application.js +2 -0
  73. data/website/javascripts/controls.js +815 -0
  74. data/website/javascripts/dragdrop.js +913 -0
  75. data/website/javascripts/effects.js +958 -0
  76. data/website/javascripts/lightbox.js +437 -0
  77. data/website/javascripts/prototype.js +2006 -0
  78. data/website/javascripts/rounded_corners_lite.inc.js +285 -0
  79. data/website/stylesheets/lightbox.css +27 -0
  80. data/website/stylesheets/screen.css +147 -0
  81. data/website/stylesheets/scruffy.css +227 -0
  82. data/website/template.html.erb +47 -0
  83. metadata +135 -55
  84. data/spec/graph_spec.rb +0 -162
data/website/images/graphs/line_test.svg ADDED
@@ -0,0 +1,60 @@
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <?DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" type=""?>
3
+ <svg xmlns:xlink="http://www.w3.org/1999/xlink" width="600" height="360" xmlns="http://www.w3.org/2000/svg">
4
+ <g id="scruffy_graph">
5
+ <g transform="translate(0.0, 0.0)" id="background">
6
+ <defs>
7
+ <linearGradient x2="0%" y2="100%" x1="0%" id="BackgroundGradient" y1="0%">
8
+ <stop stop-color="black" offset="5%"/>
9
+ <stop stop-color="#4A465A" offset="95%"/>
10
+ </linearGradient>
11
+ </defs>
12
+ <rect width="600.0" x="0" y="0" height="360.0" fill="url(#BackgroundGradient)"/>
13
+ </g>
14
+ <g transform="translate(30.0, 7.2)" id="title">
15
+ <text class="title" font-size="25.2" x="270.0" text-anchor="middle" y="25.2" stroke="none" stroke-width="0" fill="white">Sample Line Graph</text>
16
+ </g>
17
+ <g transform="translate(12.0, 93.6)" id="view">
18
+ <g>
19
+ <g transform="translate(0.0, 4.752)" id="values">
20
+ <text font-size="16.91712" x="96.12" text-anchor="end" y="211.464" fill="white">7</text>
21
+ <text font-size="16.91712" x="96.12" text-anchor="end" y="158.598" fill="white">32</text>
22
+ <text font-size="16.91712" x="96.12" text-anchor="end" y="105.732" fill="white">57</text>
23
+ <text font-size="16.91712" x="96.12" text-anchor="end" y="52.866" fill="white">81</text>
24
+ <text font-size="16.91712" x="96.12" text-anchor="end" y="0.0" fill="white">106</text>
25
+ </g>
26
+ <g transform="translate(106.8, 0.0)" id="grid">
27
+ <line x2="427.2" y2="0.0" x1="0" style="stroke: white; stroke-width: 2;" y1="0.0"/>
28
+ <line x2="427.2" y2="52.866" x1="0" style="stroke: white; stroke-width: 2;" y1="52.866"/>
29
+ <line x2="427.2" y2="105.732" x1="0" style="stroke: white; stroke-width: 2;" y1="105.732"/>
30
+ <line x2="427.2" y2="158.598" x1="0" style="stroke: white; stroke-width: 2;" y1="158.598"/>
31
+ <line x2="427.2" y2="211.464" x1="0" style="stroke: white; stroke-width: 2;" y1="211.464"/>
32
+ </g>
33
+ <g transform="translate(106.8, 218.592)" id="labels">
34
+ </g>
35
+ <g transform="translate(106.8, 0.0)" id="graphs">
36
+ <g class="graph_layer" id="component_graphs_graph_0">
37
+ <g class="shadow" transform="translate(1.05732, 1.05732)">
38
+ <polyline stroke="black" stroke-width="4.22928" points="0.0,183.881739130435 106.8,12.8289585439838 213.6,76.973751263903 320.4,162.500141557128 427.2,0.0" fill="transparent" style="fill-opacity: 0; stroke-opacity: 0.35"/>
39
+ <circle r="4.22928" cx="0.0" cy="185.784915130435" style="stroke-width: 4.22928; stroke: black; opacity: 0.35;"/>
40
+ <circle r="4.22928" cx="106.8" cy="14.7321345439838" style="stroke-width: 4.22928; stroke: black; opacity: 0.35;"/>
41
+ <circle r="4.22928" cx="213.6" cy="78.876927263903" style="stroke-width: 4.22928; stroke: black; opacity: 0.35;"/>
42
+ <circle r="4.22928" cx="320.4" cy="164.403317557128" style="stroke-width: 4.22928; stroke: black; opacity: 0.35;"/>
43
+ <circle r="4.22928" cx="427.2" cy="1.903176" style="stroke-width: 4.22928; stroke: black; opacity: 0.35;"/>
44
+ </g>
45
+ <polyline stroke="#6886B4" stroke-width="4.22928" points="0.0,183.881739130435 106.8,12.8289585439838 213.6,76.973751263903 320.4,162.500141557128 427.2,0.0" fill="none"/>
46
+ <circle r="4.22928" cx="0.0" cy="183.881739130435" style="stroke-width: 4.22928; stroke: #6886B4; fill: #6886B4"/>
47
+ <circle r="4.22928" cx="106.8" cy="12.8289585439838" style="stroke-width: 4.22928; stroke: #6886B4; fill: #6886B4"/>
48
+ <circle r="4.22928" cx="213.6" cy="76.973751263903" style="stroke-width: 4.22928; stroke: #6886B4; fill: #6886B4"/>
49
+ <circle r="4.22928" cx="320.4" cy="162.500141557128" style="stroke-width: 4.22928; stroke: #6886B4; fill: #6886B4"/>
50
+ <circle r="4.22928" cx="427.2" cy="0.0" style="stroke-width: 4.22928; stroke: #6886B4; fill: #6886B4"/>
51
+ </g>
52
+ </g>
53
+ </g>
54
+ </g>
55
+ <g transform="translate(30.0, 46.8)" id="legend">
56
+ <rect width="10.8" x="226.8" y="0" height="10.8" fill="#6886B4"/>
57
+ <text font-size="1.3824" x="228.528" y="1.0368" fill="white" style="color: white">Example</text>
58
+ </g>
59
+ </g>
60
+ </svg>
data/website/images/graphs/multi_test.svg ADDED
@@ -0,0 +1,296 @@
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <?DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" type=""?>
3
+ <svg xmlns:xlink="http://www.w3.org/1999/xlink" width="600" height="360" xmlns="http://www.w3.org/2000/svg">
4
+ <g id="scruffy_graph">
5
+ <g transform="translate(0.0, 0.0)" id="background">
6
+ <defs>
7
+ <linearGradient x2="0%" y2="100%" x1="0%" id="BackgroundGradient" y1="0%">
8
+ <stop stop-color="black" offset="5%"/>
9
+ <stop stop-color="#4A465A" offset="95%"/>
10
+ </linearGradient>
11
+ </defs>
12
+ <rect width="600.0" x="0" y="0" height="360.0" fill="url(#BackgroundGradient)"/>
13
+ </g>
14
+ <g transform="translate(30.0, 7.2)" id="title">
15
+ <text class="title" font-size="25.2" x="270.0" text-anchor="middle" y="25.2" stroke="none" stroke-width="0" fill="white">Some Kind of Information</text>
16
+ </g>
17
+ <g transform="translate(330.0, 234.0)" id="bottom_right">
18
+ <g>
19
+ <g transform="translate(21.0, 0.0)" id="grid">
20
+ <line x2="189.0" y2="0.0" x1="0" style="stroke: white; stroke-width: 2;" y1="0.0"/>
21
+ <line x2="189.0" y2="24.03" x1="0" style="stroke: white; stroke-width: 2;" y1="24.03"/>
22
+ <line x2="189.0" y2="48.06" x1="0" style="stroke: white; stroke-width: 2;" y1="48.06"/>
23
+ <line x2="189.0" y2="72.09" x1="0" style="stroke: white; stroke-width: 2;" y1="72.09"/>
24
+ <line x2="189.0" y2="96.12" x1="0" style="stroke: white; stroke-width: 2;" y1="96.12"/>
25
+ </g>
26
+ <g transform="translate(0.0, 2.16)" id="value_markers">
27
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="96.12" fill="white">-55</text>
28
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="72.09" fill="white">10</text>
29
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="48.06" fill="white">74</text>
30
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="24.03" fill="white">139</text>
31
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="0.0" fill="white">203</text>
32
+ </g>
33
+ <g transform="translate(21.0, 99.36)" id="data_markers">
34
+ <text font-size="7.776" x="0.0" text-anchor="middle" y="8.64" fill="white">Jan</text>
35
+ <text font-size="7.776" x="37.8" text-anchor="middle" y="8.64" fill="white">Feb</text>
36
+ <text font-size="7.776" x="75.6" text-anchor="middle" y="8.64" fill="white">Mar</text>
37
+ <text font-size="7.776" x="113.4" text-anchor="middle" y="8.64" fill="white">Apr</text>
38
+ <text font-size="7.776" x="151.2" text-anchor="middle" y="8.64" fill="white">May</text>
39
+ <text font-size="7.776" x="189.0" text-anchor="middle" y="8.64" fill="white">Jun</text>
40
+ </g>
41
+ <g transform="translate(21.0, 0.0)" id="graphs">
42
+ <g class="graph_layer" id="component_graphs_graph_0">
43
+ <g transform="translate(0, -1.9224)">
44
+ <polygon points="0,96.12 0.0,68.2840062111801 37.8,77.6124223602484 75.6,38.4330745341615 113.4,49.6271739130435 151.2,64.5526397515528 189.0,36.1942546583851 189.0,96.12" style="fill: black; stroke: black; fill-opacity: 0.06; stroke-opacity: 0.06;"/>
45
+ </g>
46
+ <polygon stroke="#6886B4" points="0,96.12 0.0,68.2840062111801 37.8,77.6124223602484 75.6,38.4330745341615 113.4,49.6271739130435 151.2,64.5526397515528 189.0,36.1942546583851 189.0,96.12" fill="#6886B4" style="opacity: 1.0"/>
47
+ </g>
48
+ <g class="graph_layer" id="component_graphs_graph_1">
49
+ <g class="shadow" transform="translate(0.4806, 0.4806)">
50
+ <polyline stroke="black" stroke-width="1.9224" points="0.0,79.4781055900621 37.8,83.2094720496895 75.6,57.0899068322981 113.4,41.4181677018634 151.2,83.5826086956522 189.0,54.8510869565217" fill="transparent" style="fill-opacity: 0; stroke-opacity: 0.35"/>
51
+ <circle r="1.9224" cx="0.0" cy="80.3431855900621" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
52
+ <circle r="1.9224" cx="37.8" cy="84.0745520496895" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
53
+ <circle r="1.9224" cx="75.6" cy="57.9549868322981" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
54
+ <circle r="1.9224" cx="113.4" cy="42.2832477018634" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
55
+ <circle r="1.9224" cx="151.2" cy="84.4476886956522" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
56
+ <circle r="1.9224" cx="189.0" cy="55.7161669565217" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
57
+ </g>
58
+ <polyline stroke="#FDD84E" stroke-width="1.9224" points="0.0,79.4781055900621 37.8,83.2094720496895 75.6,57.0899068322981 113.4,41.4181677018634 151.2,83.5826086956522 189.0,54.8510869565217" fill="none"/>
59
+ <circle r="1.9224" cx="0.0" cy="79.4781055900621" style="stroke-width: 1.9224; stroke: #FDD84E; fill: #FDD84E"/>
60
+ <circle r="1.9224" cx="37.8" cy="83.2094720496895" style="stroke-width: 1.9224; stroke: #FDD84E; fill: #FDD84E"/>
61
+ <circle r="1.9224" cx="75.6" cy="57.0899068322981" style="stroke-width: 1.9224; stroke: #FDD84E; fill: #FDD84E"/>
62
+ <circle r="1.9224" cx="113.4" cy="41.4181677018634" style="stroke-width: 1.9224; stroke: #FDD84E; fill: #FDD84E"/>
63
+ <circle r="1.9224" cx="151.2" cy="83.5826086956522" style="stroke-width: 1.9224; stroke: #FDD84E; fill: #FDD84E"/>
64
+ <circle r="1.9224" cx="189.0" cy="54.8510869565217" style="stroke-width: 1.9224; stroke: #FDD84E; fill: #FDD84E"/>
65
+ </g>
66
+ </g>
67
+ </g>
68
+ </g>
69
+ <g transform="translate(60.0, 234.0)" id="bottom_left">
70
+ <g>
71
+ <g transform="translate(21.0, 0.0)" id="grid">
72
+ <line x2="189.0" y2="0.0" x1="0" style="stroke: white; stroke-width: 2;" y1="0.0"/>
73
+ <line x2="189.0" y2="24.03" x1="0" style="stroke: white; stroke-width: 2;" y1="24.03"/>
74
+ <line x2="189.0" y2="48.06" x1="0" style="stroke: white; stroke-width: 2;" y1="48.06"/>
75
+ <line x2="189.0" y2="72.09" x1="0" style="stroke: white; stroke-width: 2;" y1="72.09"/>
76
+ <line x2="189.0" y2="96.12" x1="0" style="stroke: white; stroke-width: 2;" y1="96.12"/>
77
+ </g>
78
+ <g transform="translate(0.0, 2.16)" id="value_markers">
79
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="96.12" fill="white">-55</text>
80
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="72.09" fill="white">10</text>
81
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="48.06" fill="white">74</text>
82
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="24.03" fill="white">139</text>
83
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="0.0" fill="white">203</text>
84
+ </g>
85
+ <g transform="translate(21.0, 99.36)" id="data_markers">
86
+ <text font-size="7.776" x="0.0" text-anchor="middle" y="8.64" fill="white">Jan</text>
87
+ <text font-size="7.776" x="37.8" text-anchor="middle" y="8.64" fill="white">Feb</text>
88
+ <text font-size="7.776" x="75.6" text-anchor="middle" y="8.64" fill="white">Mar</text>
89
+ <text font-size="7.776" x="113.4" text-anchor="middle" y="8.64" fill="white">Apr</text>
90
+ <text font-size="7.776" x="151.2" text-anchor="middle" y="8.64" fill="white">May</text>
91
+ <text font-size="7.776" x="189.0" text-anchor="middle" y="8.64" fill="white">Jun</text>
92
+ </g>
93
+ <g transform="translate(21.0, 0.0)" id="graphs">
94
+ <g class="graph_layer" id="component_graphs_graph_0">
95
+ <g transform="translate(0, -1.9224)">
96
+ <polygon points="0,96.12 0.0,79.4781055900621 37.8,49.6271739130435 75.6,68.2840062111801 113.4,37.686801242236 151.2,0.746273291925476 189.0,66.0451863354037 189.0,96.12" style="fill: black; stroke: black; fill-opacity: 0.06; stroke-opacity: 0.06;"/>
97
+ </g>
98
+ <polygon stroke="#72AE6E" points="0,96.12 0.0,79.4781055900621 37.8,49.6271739130435 75.6,68.2840062111801 113.4,37.686801242236 151.2,0.746273291925476 189.0,66.0451863354037 189.0,96.12" fill="#72AE6E" style="opacity: 1.0"/>
99
+ </g>
100
+ <g class="graph_layer" id="component_graphs_graph_1">
101
+ <g transform="translate(-0.4806, -0.4806)">
102
+ <rect width="29.3112" x="1.575" y="64.5526397515528" height="32.5285602484472" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
103
+ <rect width="29.3112" x="2.0556" y="66.4750397515528" height="31.0867602484472" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
104
+ </g>
105
+ <rect width="28.35" x="1.575" y="64.5526397515528" height="31.5673602484472" fill="#D1695E" style="opacity: 0.85; stroke: none;"/>
106
+ <g transform="translate(-0.4806, -0.4806)">
107
+ <rect width="29.3112" x="33.075" y="75.7467391304348" height="21.3344608695652" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
108
+ <rect width="29.3112" x="33.5556" y="77.6691391304348" height="19.8926608695652" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
109
+ </g>
110
+ <rect width="28.35" x="33.075" y="75.7467391304348" height="20.3732608695652" fill="#D1695E" style="opacity: 0.85; stroke: none;"/>
111
+ <g transform="translate(-0.4806, -0.4806)">
112
+ <rect width="29.3112" x="64.575" y="57.4630434782609" height="39.6181565217391" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
113
+ <rect width="29.3112" x="65.0556" y="59.3854434782609" height="38.1763565217391" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
114
+ </g>
115
+ <rect width="28.35" x="64.575" y="57.4630434782609" height="38.6569565217391" fill="#D1695E" style="opacity: 0.85; stroke: none;"/>
116
+ <g transform="translate(-0.4806, -0.4806)">
117
+ <rect width="29.3112" x="96.075" y="64.9257763975155" height="32.1554236024845" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
118
+ <rect width="29.3112" x="96.5556" y="66.8481763975155" height="30.7136236024845" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
119
+ </g>
120
+ <rect width="28.35" x="96.075" y="64.9257763975155" height="31.1942236024845" fill="#D1695E" style="opacity: 0.85; stroke: none;"/>
121
+ <g transform="translate(-0.4806, -0.4806)">
122
+ <rect width="29.3112" x="127.575" y="38.4330745341615" height="58.6481254658385" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
123
+ <rect width="29.3112" x="128.0556" y="40.3554745341615" height="57.2063254658385" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
124
+ </g>
125
+ <rect width="28.35" x="127.575" y="38.4330745341615" height="57.6869254658385" fill="#D1695E" style="opacity: 0.85; stroke: none;"/>
126
+ <g transform="translate(-0.4806, -0.4806)">
127
+ <rect width="29.3112" x="159.075" y="0.0" height="97.0812" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
128
+ <rect width="29.3112" x="159.5556" y="1.9224" height="95.6394" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
129
+ </g>
130
+ <rect width="28.35" x="159.075" y="0.0" height="96.12" fill="#D1695E" style="opacity: 0.85; stroke: none;"/>
131
+ </g>
132
+ <g class="graph_layer" id="component_graphs_graph_2">
133
+ <g class="shadow" transform="translate(0.4806, 0.4806)">
134
+ <polyline stroke="black" stroke-width="1.9224" points="0.0,60.075 37.8,72.0153726708075 75.6,47.7614906832298 113.4,19.7762422360249 151.2,27.2389751552795 189.0,49.6271739130435" fill="transparent" style="fill-opacity: 0; stroke-opacity: 0.35"/>
135
+ <circle r="1.9224" cx="0.0" cy="60.94008" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
136
+ <circle r="1.9224" cx="37.8" cy="72.8804526708075" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
137
+ <circle r="1.9224" cx="75.6" cy="48.6265706832298" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
138
+ <circle r="1.9224" cx="113.4" cy="20.6413222360249" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
139
+ <circle r="1.9224" cx="151.2" cy="28.1040551552795" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
140
+ <circle r="1.9224" cx="189.0" cy="50.4922539130435" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
141
+ </g>
142
+ <polyline stroke="#8A6EAF" stroke-width="1.9224" points="0.0,60.075 37.8,72.0153726708075 75.6,47.7614906832298 113.4,19.7762422360249 151.2,27.2389751552795 189.0,49.6271739130435" fill="none"/>
143
+ <circle r="1.9224" cx="0.0" cy="60.075" style="stroke-width: 1.9224; stroke: #8A6EAF; fill: #8A6EAF"/>
144
+ <circle r="1.9224" cx="37.8" cy="72.0153726708075" style="stroke-width: 1.9224; stroke: #8A6EAF; fill: #8A6EAF"/>
145
+ <circle r="1.9224" cx="75.6" cy="47.7614906832298" style="stroke-width: 1.9224; stroke: #8A6EAF; fill: #8A6EAF"/>
146
+ <circle r="1.9224" cx="113.4" cy="19.7762422360249" style="stroke-width: 1.9224; stroke: #8A6EAF; fill: #8A6EAF"/>
147
+ <circle r="1.9224" cx="151.2" cy="27.2389751552795" style="stroke-width: 1.9224; stroke: #8A6EAF; fill: #8A6EAF"/>
148
+ <circle r="1.9224" cx="189.0" cy="49.6271739130435" style="stroke-width: 1.9224; stroke: #8A6EAF; fill: #8A6EAF"/>
149
+ </g>
150
+ </g>
151
+ </g>
152
+ </g>
153
+ <g transform="translate(330.0, 90.0)" id="top_right">
154
+ <g>
155
+ <g transform="translate(21.0, 0.0)" id="grid">
156
+ <line x2="189.0" y2="0.0" x1="0" style="stroke: white; stroke-width: 2;" y1="0.0"/>
157
+ <line x2="189.0" y2="24.03" x1="0" style="stroke: white; stroke-width: 2;" y1="24.03"/>
158
+ <line x2="189.0" y2="48.06" x1="0" style="stroke: white; stroke-width: 2;" y1="48.06"/>
159
+ <line x2="189.0" y2="72.09" x1="0" style="stroke: white; stroke-width: 2;" y1="72.09"/>
160
+ <line x2="189.0" y2="96.12" x1="0" style="stroke: white; stroke-width: 2;" y1="96.12"/>
161
+ </g>
162
+ <g transform="translate(0.0, 2.16)" id="value_markers">
163
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="96.12" fill="white">-55</text>
164
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="72.09" fill="white">10</text>
165
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="48.06" fill="white">74</text>
166
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="24.03" fill="white">139</text>
167
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="0.0" fill="white">203</text>
168
+ </g>
169
+ <g transform="translate(21.0, 99.36)" id="data_markers">
170
+ <text font-size="7.776" x="0.0" text-anchor="middle" y="8.64" fill="white">Jan</text>
171
+ <text font-size="7.776" x="37.8" text-anchor="middle" y="8.64" fill="white">Feb</text>
172
+ <text font-size="7.776" x="75.6" text-anchor="middle" y="8.64" fill="white">Mar</text>
173
+ <text font-size="7.776" x="113.4" text-anchor="middle" y="8.64" fill="white">Apr</text>
174
+ <text font-size="7.776" x="151.2" text-anchor="middle" y="8.64" fill="white">May</text>
175
+ <text font-size="7.776" x="189.0" text-anchor="middle" y="8.64" fill="white">Jun</text>
176
+ </g>
177
+ <g transform="translate(21.0, 0.0)" id="graphs">
178
+ <g class="graph_layer" id="component_graphs_graph_0">
179
+ <g transform="translate(-0.4806, -0.4806)">
180
+ <rect width="29.3112" x="1.575" y="64.5526397515528" height="32.5285602484472" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
181
+ <rect width="29.3112" x="2.0556" y="66.4750397515528" height="31.0867602484472" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
182
+ </g>
183
+ <rect width="28.35" x="1.575" y="64.5526397515528" height="31.5673602484472" fill="#D1695E" style="opacity: 1.0; stroke: none;"/>
184
+ <g transform="translate(-0.4806, -0.4806)">
185
+ <rect width="29.3112" x="33.075" y="75.7467391304348" height="21.3344608695652" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
186
+ <rect width="29.3112" x="33.5556" y="77.6691391304348" height="19.8926608695652" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
187
+ </g>
188
+ <rect width="28.35" x="33.075" y="75.7467391304348" height="20.3732608695652" fill="#D1695E" style="opacity: 1.0; stroke: none;"/>
189
+ <g transform="translate(-0.4806, -0.4806)">
190
+ <rect width="29.3112" x="64.575" y="57.4630434782609" height="39.6181565217391" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
191
+ <rect width="29.3112" x="65.0556" y="59.3854434782609" height="38.1763565217391" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
192
+ </g>
193
+ <rect width="28.35" x="64.575" y="57.4630434782609" height="38.6569565217391" fill="#D1695E" style="opacity: 1.0; stroke: none;"/>
194
+ <g transform="translate(-0.4806, -0.4806)">
195
+ <rect width="29.3112" x="96.075" y="64.9257763975155" height="32.1554236024845" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
196
+ <rect width="29.3112" x="96.5556" y="66.8481763975155" height="30.7136236024845" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
197
+ </g>
198
+ <rect width="28.35" x="96.075" y="64.9257763975155" height="31.1942236024845" fill="#D1695E" style="opacity: 1.0; stroke: none;"/>
199
+ <g transform="translate(-0.4806, -0.4806)">
200
+ <rect width="29.3112" x="127.575" y="38.4330745341615" height="58.6481254658385" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
201
+ <rect width="29.3112" x="128.0556" y="40.3554745341615" height="57.2063254658385" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
202
+ </g>
203
+ <rect width="28.35" x="127.575" y="38.4330745341615" height="57.6869254658385" fill="#D1695E" style="opacity: 1.0; stroke: none;"/>
204
+ <g transform="translate(-0.4806, -0.4806)">
205
+ <rect width="29.3112" x="159.075" y="0.0" height="97.0812" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
206
+ <rect width="29.3112" x="159.5556" y="1.9224" height="95.6394" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
207
+ </g>
208
+ <rect width="28.35" x="159.075" y="0.0" height="96.12" fill="#D1695E" style="opacity: 1.0; stroke: none;"/>
209
+ </g>
210
+ <g class="graph_layer" id="component_graphs_graph_1">
211
+ <g class="shadow" transform="translate(0.4806, 0.4806)">
212
+ <polyline stroke="black" stroke-width="1.9224" points="0.0,60.075 37.8,72.0153726708075 75.6,47.7614906832298 113.4,19.7762422360249 151.2,27.2389751552795 189.0,49.6271739130435" fill="transparent" style="fill-opacity: 0; stroke-opacity: 0.35"/>
213
+ <circle r="1.9224" cx="0.0" cy="60.94008" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
214
+ <circle r="1.9224" cx="37.8" cy="72.8804526708075" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
215
+ <circle r="1.9224" cx="75.6" cy="48.6265706832298" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
216
+ <circle r="1.9224" cx="113.4" cy="20.6413222360249" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
217
+ <circle r="1.9224" cx="151.2" cy="28.1040551552795" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
218
+ <circle r="1.9224" cx="189.0" cy="50.4922539130435" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
219
+ </g>
220
+ <polyline stroke="#8A6EAF" stroke-width="1.9224" points="0.0,60.075 37.8,72.0153726708075 75.6,47.7614906832298 113.4,19.7762422360249 151.2,27.2389751552795 189.0,49.6271739130435" fill="none"/>
221
+ <circle r="1.9224" cx="0.0" cy="60.075" style="stroke-width: 1.9224; stroke: #8A6EAF; fill: #8A6EAF"/>
222
+ <circle r="1.9224" cx="37.8" cy="72.0153726708075" style="stroke-width: 1.9224; stroke: #8A6EAF; fill: #8A6EAF"/>
223
+ <circle r="1.9224" cx="75.6" cy="47.7614906832298" style="stroke-width: 1.9224; stroke: #8A6EAF; fill: #8A6EAF"/>
224
+ <circle r="1.9224" cx="113.4" cy="19.7762422360249" style="stroke-width: 1.9224; stroke: #8A6EAF; fill: #8A6EAF"/>
225
+ <circle r="1.9224" cx="151.2" cy="27.2389751552795" style="stroke-width: 1.9224; stroke: #8A6EAF; fill: #8A6EAF"/>
226
+ <circle r="1.9224" cx="189.0" cy="49.6271739130435" style="stroke-width: 1.9224; stroke: #8A6EAF; fill: #8A6EAF"/>
227
+ </g>
228
+ </g>
229
+ </g>
230
+ </g>
231
+ <g transform="translate(60.0, 90.0)" id="top_left">
232
+ <g>
233
+ <g transform="translate(21.0, 0.0)" id="grid">
234
+ <line x2="189.0" y2="0.0" x1="0" style="stroke: white; stroke-width: 2;" y1="0.0"/>
235
+ <line x2="189.0" y2="24.03" x1="0" style="stroke: white; stroke-width: 2;" y1="24.03"/>
236
+ <line x2="189.0" y2="48.06" x1="0" style="stroke: white; stroke-width: 2;" y1="48.06"/>
237
+ <line x2="189.0" y2="72.09" x1="0" style="stroke: white; stroke-width: 2;" y1="72.09"/>
238
+ <line x2="189.0" y2="96.12" x1="0" style="stroke: white; stroke-width: 2;" y1="96.12"/>
239
+ </g>
240
+ <g transform="translate(0.0, 2.16)" id="value_markers">
241
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="96.12" fill="white">-55</text>
242
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="72.09" fill="white">10</text>
243
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="48.06" fill="white">74</text>
244
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="24.03" fill="white">139</text>
245
+ <text font-size="7.6896" x="16.8" text-anchor="end" y="0.0" fill="white">203</text>
246
+ </g>
247
+ <g transform="translate(21.0, 99.36)" id="data_markers">
248
+ <text font-size="7.776" x="0.0" text-anchor="middle" y="8.64" fill="white">Jan</text>
249
+ <text font-size="7.776" x="37.8" text-anchor="middle" y="8.64" fill="white">Feb</text>
250
+ <text font-size="7.776" x="75.6" text-anchor="middle" y="8.64" fill="white">Mar</text>
251
+ <text font-size="7.776" x="113.4" text-anchor="middle" y="8.64" fill="white">Apr</text>
252
+ <text font-size="7.776" x="151.2" text-anchor="middle" y="8.64" fill="white">May</text>
253
+ <text font-size="7.776" x="189.0" text-anchor="middle" y="8.64" fill="white">Jun</text>
254
+ </g>
255
+ <g transform="translate(21.0, 0.0)" id="graphs">
256
+ <g class="graph_layer" id="component_graphs_graph_0">
257
+ <g transform="translate(0, -1.9224)">
258
+ <polygon points="0,96.12 0.0,68.2840062111801 37.8,77.6124223602484 75.6,38.4330745341615 113.4,49.6271739130435 151.2,64.5526397515528 189.0,36.1942546583851 189.0,96.12" style="fill: black; stroke: black; fill-opacity: 0.06; stroke-opacity: 0.06;"/>
259
+ </g>
260
+ <polygon stroke="#6886B4" points="0,96.12 0.0,68.2840062111801 37.8,77.6124223602484 75.6,38.4330745341615 113.4,49.6271739130435 151.2,64.5526397515528 189.0,36.1942546583851 189.0,96.12" fill="#6886B4" style="opacity: 1.0"/>
261
+ </g>
262
+ <g class="graph_layer" id="component_graphs_graph_1">
263
+ <g class="shadow" transform="translate(0.4806, 0.4806)">
264
+ <polyline stroke="black" stroke-width="1.9224" points="0.0,79.4781055900621 37.8,83.2094720496895 75.6,57.0899068322981 113.4,41.4181677018634 151.2,83.5826086956522 189.0,54.8510869565217" fill="transparent" style="fill-opacity: 0; stroke-opacity: 0.35"/>
265
+ <circle r="1.9224" cx="0.0" cy="80.3431855900621" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
266
+ <circle r="1.9224" cx="37.8" cy="84.0745520496895" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
267
+ <circle r="1.9224" cx="75.6" cy="57.9549868322981" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
268
+ <circle r="1.9224" cx="113.4" cy="42.2832477018634" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
269
+ <circle r="1.9224" cx="151.2" cy="84.4476886956522" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
270
+ <circle r="1.9224" cx="189.0" cy="55.7161669565217" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
271
+ </g>
272
+ <polyline stroke="#FDD84E" stroke-width="1.9224" points="0.0,79.4781055900621 37.8,83.2094720496895 75.6,57.0899068322981 113.4,41.4181677018634 151.2,83.5826086956522 189.0,54.8510869565217" fill="none"/>
273
+ <circle r="1.9224" cx="0.0" cy="79.4781055900621" style="stroke-width: 1.9224; stroke: #FDD84E; fill: #FDD84E"/>
274
+ <circle r="1.9224" cx="37.8" cy="83.2094720496895" style="stroke-width: 1.9224; stroke: #FDD84E; fill: #FDD84E"/>
275
+ <circle r="1.9224" cx="75.6" cy="57.0899068322981" style="stroke-width: 1.9224; stroke: #FDD84E; fill: #FDD84E"/>
276
+ <circle r="1.9224" cx="113.4" cy="41.4181677018634" style="stroke-width: 1.9224; stroke: #FDD84E; fill: #FDD84E"/>
277
+ <circle r="1.9224" cx="151.2" cy="83.5826086956522" style="stroke-width: 1.9224; stroke: #FDD84E; fill: #FDD84E"/>
278
+ <circle r="1.9224" cx="189.0" cy="54.8510869565217" style="stroke-width: 1.9224; stroke: #FDD84E; fill: #FDD84E"/>
279
+ </g>
280
+ </g>
281
+ </g>
282
+ </g>
283
+ <g transform="translate(30.0, 46.8)" id="legend">
284
+ <rect width="9.0" x="108.0" y="0" height="9.0" fill="#6886B4"/>
285
+ <text font-size="1.152" x="109.44" y="0.864" fill="white" style="color: white">Jeff</text>
286
+ <rect width="9.0" x="171.0" y="0" height="9.0" fill="#72AE6E"/>
287
+ <text font-size="1.152" x="172.44" y="0.864" fill="white" style="color: white">Jerry</text>
288
+ <rect width="9.0" x="243.0" y="0" height="9.0" fill="#D1695E"/>
289
+ <text font-size="1.152" x="244.44" y="0.864" fill="white" style="color: white">Jack</text>
290
+ <rect width="9.0" x="306.0" y="0" height="9.0" fill="#8A6EAF"/>
291
+ <text font-size="1.152" x="307.44" y="0.864" fill="white" style="color: white">Brasten</text>
292
+ <rect width="9.0" x="396.0" y="0" height="9.0" fill="#FDD84E"/>
293
+ <text font-size="1.152" x="397.44" y="0.864" fill="white" style="color: white">Jim</text>
294
+ </g>
295
+ </g>
296
+ </svg>
data/website/images/graphs/pie_test.svg ADDED
@@ -0,0 +1,40 @@
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <?DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" type=""?>
3
+ <svg xmlns:xlink="http://www.w3.org/1999/xlink" width="600" height="360" xmlns="http://www.w3.org/2000/svg">
4
+ <g id="scruffy_graph">
5
+ <g transform="translate(0.0, 0.0)" id="background">
6
+ <defs>
7
+ <linearGradient x2="0%" y2="100%" x1="0%" id="BackgroundGradient" y1="0%">
8
+ <stop stop-color="black" offset="5%"/>
9
+ <stop stop-color="#4A465A" offset="95%"/>
10
+ </linearGradient>
11
+ </defs>
12
+ <rect width="600.0" x="0" y="0" height="360.0" fill="url(#BackgroundGradient)"/>
13
+ </g>
14
+ <g transform="translate(-90.0, 43.2)" id="graphs">
15
+ <g class="graph_layer" id="component_graphs_graph_0">
16
+ <path d="M270.0,158.4 L390.517881744922,197.558633527193 A126.72,126.72 0, 0, 1, 319.32830787254 275.124789322714 Z" stroke="none" fill="#FDD84E"/>
17
+ <text font-size="19.008" x="382.031804390038" text-anchor="middle" y="270.725860035269" fill="white">13%</text>
18
+ <path d="M270.0,158.4 L319.32830787254,275.124789322714 A126.72,126.72 0, 0, 1, 143.331677324812 154.781377243423 Z" stroke="none" fill="#72AE6E"/>
19
+ <text font-size="19.008" x="184.168506366244" text-anchor="middle" y="293.428558539747" fill="white">31%</text>
20
+ <path d="M270.0,158.4 L143.331677324812,154.781377243423 A126.72,126.72 0, 0, 1, 165.396201216877 86.8737553052029 Z" stroke="none" fill="#D1695E"/>
21
+ <text font-size="19.008" x="125.378541906094" text-anchor="middle" y="120.913639767368" fill="white">9%</text>
22
+ <path d="M270.0,158.4 L165.396201216877,86.8737553052029 A126.72,126.72 0, 0, 1, 390.517881744922 197.558633527193 Z" stroke="none" fill="#8A6EAF"/>
23
+ <text font-size="19.008" x="337.093845539449" text-anchor="middle" y="31.4420053394773" fill="white">45%</text>
24
+ </g>
25
+ </g>
26
+ <g transform="translate(30.0, 7.2)" id="title">
27
+ <text class="title" font-size="25.2" x="270.0" text-anchor="middle" y="25.2" stroke="none" stroke-width="0" fill="white">Favourite Snacks</text>
28
+ </g>
29
+ <g transform="translate(360.0, 54.0)" id="legend">
30
+ <rect width="12.672" x="0" y="0.0" height="12.672" fill="#FDD84E"/>
31
+ <text font-size="20.2752" x="25.344" y="15.2064" fill="white" style="color: white">Taco</text>
32
+ <rect width="12.672" x="0" y="25.344" height="12.672" fill="#72AE6E"/>
33
+ <text font-size="20.2752" x="25.344" y="40.5504" fill="white" style="color: white">Orange</text>
34
+ <rect width="12.672" x="0" y="50.688" height="12.672" fill="#D1695E"/>
35
+ <text font-size="20.2752" x="25.344" y="65.8944" fill="white" style="color: white">Apple</text>
36
+ <rect width="12.672" x="0" y="76.032" height="12.672" fill="#8A6EAF"/>
37
+ <text font-size="20.2752" x="25.344" y="91.2384" fill="white" style="color: white">Banana</text>
38
+ </g>
39
+ </g>
40
+ </svg>
data/website/images/graphs/split_test.svg ADDED
@@ -0,0 +1,295 @@
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <?DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" type=""?>
3
+ <svg xmlns:xlink="http://www.w3.org/1999/xlink" width="600" height="360" xmlns="http://www.w3.org/2000/svg">
4
+ <g id="scruffy_graph">
5
+ <g transform="translate(0.0, 0.0)" id="background">
6
+ <defs>
7
+ <linearGradient x2="0%" y2="100%" x1="0%" id="BackgroundGradient" y1="0%">
8
+ <stop stop-color="black" offset="5%"/>
9
+ <stop stop-color="#4A465A" offset="95%"/>
10
+ </linearGradient>
11
+ </defs>
12
+ <rect width="600.0" x="0" y="0" height="360.0" fill="url(#BackgroundGradient)"/>
13
+ </g>
14
+ <g transform="translate(30.0, 7.2)" id="title">
15
+ <text class="title" font-size="25.2" x="270.0" text-anchor="middle" y="25.2" stroke="none" stroke-width="0" fill="white">Long-term Comparisons</text>
16
+ </g>
17
+ <g transform="translate(180.0, 196.2)" id="label_one">
18
+ <text class="text" font-size="10.8" x="120.0" text-anchor="middle" y="10.8" stroke="none" stroke-width="0" fill="white">Northeastern (Top) / Central (Bottom)</text>
19
+ </g>
20
+ <g transform="translate(18.0, 72.0)" id="top">
21
+ <g>
22
+ <g transform="translate(54.0, 0.0)" id="grid">
23
+ <line x2="486.0" y2="0.0" x1="0" style="stroke: white; stroke-width: 2;" y1="0.0"/>
24
+ <line x2="486.0" y2="24.03" x1="0" style="stroke: white; stroke-width: 2;" y1="24.03"/>
25
+ <line x2="486.0" y2="48.06" x1="0" style="stroke: white; stroke-width: 2;" y1="48.06"/>
26
+ <line x2="486.0" y2="72.09" x1="0" style="stroke: white; stroke-width: 2;" y1="72.09"/>
27
+ <line x2="486.0" y2="96.12" x1="0" style="stroke: white; stroke-width: 2;" y1="96.12"/>
28
+ </g>
29
+ <g transform="translate(0.0, 2.16)" id="values">
30
+ <text font-size="7.6896" x="43.2" text-anchor="end" y="96.12" fill="white">($67.50)</text>
31
+ <text font-size="7.6896" x="43.2" text-anchor="end" y="72.09" fill="white">$21.62</text>
32
+ <text font-size="7.6896" x="43.2" text-anchor="end" y="48.06" fill="white">$110.75</text>
33
+ <text font-size="7.6896" x="43.2" text-anchor="end" y="24.03" fill="white">$199.88</text>
34
+ <text font-size="7.6896" x="43.2" text-anchor="end" y="0.0" fill="white">$289.00</text>
35
+ </g>
36
+ <g transform="translate(54.0, 99.36)" id="labels">
37
+ <text font-size="7.776" x="0.0" text-anchor="middle" y="8.64" fill="white">Jan</text>
38
+ <text font-size="7.776" x="44.1818181818182" text-anchor="middle" y="8.64" fill="white">Feb</text>
39
+ <text font-size="7.776" x="88.3636363636364" text-anchor="middle" y="8.64" fill="white">Mar</text>
40
+ <text font-size="7.776" x="132.545454545455" text-anchor="middle" y="8.64" fill="white">Apr</text>
41
+ <text font-size="7.776" x="176.727272727273" text-anchor="middle" y="8.64" fill="white">May</text>
42
+ <text font-size="7.776" x="220.909090909091" text-anchor="middle" y="8.64" fill="white">Jun</text>
43
+ <text font-size="7.776" x="265.090909090909" text-anchor="middle" y="8.64" fill="white">Jul</text>
44
+ <text font-size="7.776" x="309.272727272727" text-anchor="middle" y="8.64" fill="white">Aug</text>
45
+ <text font-size="7.776" x="353.454545454545" text-anchor="middle" y="8.64" fill="white">Sep</text>
46
+ <text font-size="7.776" x="397.636363636364" text-anchor="middle" y="8.64" fill="white">Oct</text>
47
+ <text font-size="7.776" x="441.818181818182" text-anchor="middle" y="8.64" fill="white">Nov</text>
48
+ <text font-size="7.776" x="486.0" text-anchor="middle" y="8.64" fill="white">Dec</text>
49
+ </g>
50
+ <g transform="translate(54.0, 0.0)" id="graphs">
51
+ <g class="graph_layer" id="component_graphs_graph_0">
52
+ <g transform="translate(0, -1.9224)">
53
+ <polygon points="0,96.12 0.0,72.5281346423562 44.1818181818182,79.268667601683 88.3636363636364,50.9584291725105 132.545454545455,59.0470687237027 176.727272727273,69.8319214586255 220.909090909091,49.3407012622721 265.090909090909,23.1874333800842 309.272727272727,50.9584291725105 353.454545454545,64.4394950911641 397.636363636364,23.1874333800842 441.818181818182,0.0 486.0,72.5281346423562 486.0,96.12" style="fill: black; stroke: black; fill-opacity: 0.06; stroke-opacity: 0.06;"/>
54
+ </g>
55
+ <polygon stroke="#6886B4" points="0,96.12 0.0,72.5281346423562 44.1818181818182,79.268667601683 88.3636363636364,50.9584291725105 132.545454545455,59.0470687237027 176.727272727273,69.8319214586255 220.909090909091,49.3407012622721 265.090909090909,23.1874333800842 309.272727272727,50.9584291725105 353.454545454545,64.4394950911641 397.636363636364,23.1874333800842 441.818181818182,0.0 486.0,72.5281346423562 486.0,96.12" fill="#6886B4" style="opacity: 1.0"/>
56
+ </g>
57
+ <g class="graph_layer" id="component_graphs_graph_1">
58
+ <g transform="translate(0, -1.9224)">
59
+ <polygon points="0,96.12 0.0,80.6167741935484 44.1818181818182,59.0470687237027 88.3636363636364,72.5281346423562 132.545454545455,50.4191865357644 176.727272727273,23.7266760168303 220.909090909091,70.9104067321178 265.090909090909,69.8319214586255 309.272727272727,49.3407012622721 353.454545454545,23.1874333800842 397.636363636364,50.9584291725105 441.818181818182,64.4394950911641 486.0,67.4053295932679 486.0,96.12" style="fill: black; stroke: black; fill-opacity: 0.06; stroke-opacity: 0.06;"/>
60
+ </g>
61
+ <polygon stroke="#FDD84E" points="0,96.12 0.0,80.6167741935484 44.1818181818182,59.0470687237027 88.3636363636364,72.5281346423562 132.545454545455,50.4191865357644 176.727272727273,23.7266760168303 220.909090909091,70.9104067321178 265.090909090909,69.8319214586255 309.272727272727,49.3407012622721 353.454545454545,23.1874333800842 397.636363636364,50.9584291725105 441.818181818182,64.4394950911641 486.0,67.4053295932679 486.0,96.12" fill="#FDD84E" style="opacity: 0.85"/>
62
+ </g>
63
+ <g class="graph_layer" id="component_graphs_graph_2">
64
+ <g class="shadow" transform="translate(0.4806, 0.4806)">
65
+ <polyline stroke="black" stroke-width="1.9224" points="0.0,66.5964656381487 44.1818181818182,75.224347826087 88.3636363636364,57.6989621318373 132.545454545455,37.477363253857 176.727272727273,42.8697896213184 220.909090909091,59.0470687237027 265.090909090909,80.6167741935484 309.272727272727,83.3129873772791 353.454545454545,64.4394950911641 397.636363636364,53.1153997194951 441.818181818182,83.5826086956522 486.0,72.7977559607293" fill="transparent" style="fill-opacity: 0; stroke-opacity: 0.35"/>
66
+ <circle r="1.9224" cx="0.0" cy="67.4615456381487" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
67
+ <circle r="1.9224" cx="44.1818181818182" cy="76.089427826087" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
68
+ <circle r="1.9224" cx="88.3636363636364" cy="58.5640421318373" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
69
+ <circle r="1.9224" cx="132.545454545455" cy="38.3424432538569" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
70
+ <circle r="1.9224" cx="176.727272727273" cy="43.7348696213184" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
71
+ <circle r="1.9224" cx="220.909090909091" cy="59.9121487237027" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
72
+ <circle r="1.9224" cx="265.090909090909" cy="81.4818541935484" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
73
+ <circle r="1.9224" cx="309.272727272727" cy="84.1780673772791" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
74
+ <circle r="1.9224" cx="353.454545454545" cy="65.3045750911641" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
75
+ <circle r="1.9224" cx="397.636363636364" cy="53.9804797194951" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
76
+ <circle r="1.9224" cx="441.818181818182" cy="84.4476886956522" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
77
+ <circle r="1.9224" cx="486.0" cy="73.6628359607293" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
78
+ </g>
79
+ <polyline stroke="#72AE6E" stroke-width="1.9224" points="0.0,66.5964656381487 44.1818181818182,75.224347826087 88.3636363636364,57.6989621318373 132.545454545455,37.477363253857 176.727272727273,42.8697896213184 220.909090909091,59.0470687237027 265.090909090909,80.6167741935484 309.272727272727,83.3129873772791 353.454545454545,64.4394950911641 397.636363636364,53.1153997194951 441.818181818182,83.5826086956522 486.0,72.7977559607293" fill="none"/>
80
+ <circle r="1.9224" cx="0.0" cy="66.5964656381487" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
81
+ <circle r="1.9224" cx="44.1818181818182" cy="75.224347826087" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
82
+ <circle r="1.9224" cx="88.3636363636364" cy="57.6989621318373" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
83
+ <circle r="1.9224" cx="132.545454545455" cy="37.477363253857" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
84
+ <circle r="1.9224" cx="176.727272727273" cy="42.8697896213184" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
85
+ <circle r="1.9224" cx="220.909090909091" cy="59.0470687237027" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
86
+ <circle r="1.9224" cx="265.090909090909" cy="80.6167741935484" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
87
+ <circle r="1.9224" cx="309.272727272727" cy="83.3129873772791" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
88
+ <circle r="1.9224" cx="353.454545454545" cy="64.4394950911641" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
89
+ <circle r="1.9224" cx="397.636363636364" cy="53.1153997194951" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
90
+ <circle r="1.9224" cx="441.818181818182" cy="83.5826086956522" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
91
+ <circle r="1.9224" cx="486.0" cy="72.7977559607293" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
92
+ </g>
93
+ <g class="graph_layer" id="component_graphs_graph_3">
94
+ <g class="shadow" transform="translate(0.4806, 0.4806)">
95
+ <polyline stroke="black" stroke-width="1.9224" points="0.0,80.6167741935484 44.1818181818182,83.3129873772791 88.3636363636364,64.4394950911641 132.545454545455,53.1153997194951 176.727272727273,83.5826086956522 220.909090909091,62.8217671809257 265.090909090909,53.1153997194951 309.272727272727,55.2723702664797 353.454545454545,55.8116129032258 397.636363636364,50.9584291725105 441.818181818182,67.4053295932679 486.0,45.5660028050491" fill="transparent" style="fill-opacity: 0; stroke-opacity: 0.35"/>
96
+ <circle r="1.9224" cx="0.0" cy="81.4818541935484" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
97
+ <circle r="1.9224" cx="44.1818181818182" cy="84.1780673772791" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
98
+ <circle r="1.9224" cx="88.3636363636364" cy="65.3045750911641" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
99
+ <circle r="1.9224" cx="132.545454545455" cy="53.9804797194951" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
100
+ <circle r="1.9224" cx="176.727272727273" cy="84.4476886956522" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
101
+ <circle r="1.9224" cx="220.909090909091" cy="63.6868471809257" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
102
+ <circle r="1.9224" cx="265.090909090909" cy="53.9804797194951" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
103
+ <circle r="1.9224" cx="309.272727272727" cy="56.1374502664797" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
104
+ <circle r="1.9224" cx="353.454545454545" cy="56.6766929032258" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
105
+ <circle r="1.9224" cx="397.636363636364" cy="51.8235091725105" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
106
+ <circle r="1.9224" cx="441.818181818182" cy="68.2704095932679" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
107
+ <circle r="1.9224" cx="486.0" cy="46.4310828050491" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
108
+ </g>
109
+ <polyline stroke="#D1695E" stroke-width="1.9224" points="0.0,80.6167741935484 44.1818181818182,83.3129873772791 88.3636363636364,64.4394950911641 132.545454545455,53.1153997194951 176.727272727273,83.5826086956522 220.909090909091,62.8217671809257 265.090909090909,53.1153997194951 309.272727272727,55.2723702664797 353.454545454545,55.8116129032258 397.636363636364,50.9584291725105 441.818181818182,67.4053295932679 486.0,45.5660028050491" fill="none"/>
110
+ <circle r="1.9224" cx="0.0" cy="80.6167741935484" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
111
+ <circle r="1.9224" cx="44.1818181818182" cy="83.3129873772791" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
112
+ <circle r="1.9224" cx="88.3636363636364" cy="64.4394950911641" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
113
+ <circle r="1.9224" cx="132.545454545455" cy="53.1153997194951" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
114
+ <circle r="1.9224" cx="176.727272727273" cy="83.5826086956522" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
115
+ <circle r="1.9224" cx="220.909090909091" cy="62.8217671809257" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
116
+ <circle r="1.9224" cx="265.090909090909" cy="53.1153997194951" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
117
+ <circle r="1.9224" cx="309.272727272727" cy="55.2723702664797" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
118
+ <circle r="1.9224" cx="353.454545454545" cy="55.8116129032258" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
119
+ <circle r="1.9224" cx="397.636363636364" cy="50.9584291725105" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
120
+ <circle r="1.9224" cx="441.818181818182" cy="67.4053295932679" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
121
+ <circle r="1.9224" cx="486.0" cy="45.5660028050491" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
122
+ </g>
123
+ </g>
124
+ </g>
125
+ </g>
126
+ <g transform="translate(18.0, 234.0)" id="bottom">
127
+ <g>
128
+ <g transform="translate(54.0, 0.0)" id="grid">
129
+ <line x2="486.0" y2="0.0" x1="0" style="stroke: white; stroke-width: 2;" y1="0.0"/>
130
+ <line x2="486.0" y2="24.03" x1="0" style="stroke: white; stroke-width: 2;" y1="24.03"/>
131
+ <line x2="486.0" y2="48.06" x1="0" style="stroke: white; stroke-width: 2;" y1="48.06"/>
132
+ <line x2="486.0" y2="72.09" x1="0" style="stroke: white; stroke-width: 2;" y1="72.09"/>
133
+ <line x2="486.0" y2="96.12" x1="0" style="stroke: white; stroke-width: 2;" y1="96.12"/>
134
+ </g>
135
+ <g transform="translate(0.0, 2.16)" id="values">
136
+ <text font-size="7.6896" x="43.2" text-anchor="end" y="96.12" fill="white">($67.50)</text>
137
+ <text font-size="7.6896" x="43.2" text-anchor="end" y="72.09" fill="white">$21.62</text>
138
+ <text font-size="7.6896" x="43.2" text-anchor="end" y="48.06" fill="white">$110.75</text>
139
+ <text font-size="7.6896" x="43.2" text-anchor="end" y="24.03" fill="white">$199.88</text>
140
+ <text font-size="7.6896" x="43.2" text-anchor="end" y="0.0" fill="white">$289.00</text>
141
+ </g>
142
+ <g transform="translate(54.0, 99.36)" id="labels">
143
+ <text font-size="7.776" x="0.0" text-anchor="middle" y="8.64" fill="white">Jan</text>
144
+ <text font-size="7.776" x="44.1818181818182" text-anchor="middle" y="8.64" fill="white">Feb</text>
145
+ <text font-size="7.776" x="88.3636363636364" text-anchor="middle" y="8.64" fill="white">Mar</text>
146
+ <text font-size="7.776" x="132.545454545455" text-anchor="middle" y="8.64" fill="white">Apr</text>
147
+ <text font-size="7.776" x="176.727272727273" text-anchor="middle" y="8.64" fill="white">May</text>
148
+ <text font-size="7.776" x="220.909090909091" text-anchor="middle" y="8.64" fill="white">Jun</text>
149
+ <text font-size="7.776" x="265.090909090909" text-anchor="middle" y="8.64" fill="white">Jul</text>
150
+ <text font-size="7.776" x="309.272727272727" text-anchor="middle" y="8.64" fill="white">Aug</text>
151
+ <text font-size="7.776" x="353.454545454545" text-anchor="middle" y="8.64" fill="white">Sep</text>
152
+ <text font-size="7.776" x="397.636363636364" text-anchor="middle" y="8.64" fill="white">Oct</text>
153
+ <text font-size="7.776" x="441.818181818182" text-anchor="middle" y="8.64" fill="white">Nov</text>
154
+ <text font-size="7.776" x="486.0" text-anchor="middle" y="8.64" fill="white">Dec</text>
155
+ </g>
156
+ <g transform="translate(54.0, 0.0)" id="graphs">
157
+ <g class="graph_layer" id="component_graphs_graph_0">
158
+ <g transform="translate(-0.4806, -0.4806)">
159
+ <rect width="37.4112" x="2.025" y="69.8319214586255" height="27.2492785413745" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
160
+ <rect width="37.4112" x="2.5056" y="71.7543214586255" height="25.8074785413745" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
161
+ </g>
162
+ <rect width="36.45" x="2.025" y="69.8319214586255" height="26.2880785413745" fill="#8A6EAF" style="opacity: 1.0; stroke: none;"/>
163
+ <g transform="translate(-0.4806, -0.4806)">
164
+ <rect width="37.4112" x="42.525" y="77.9205610098177" height="19.1606389901823" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
165
+ <rect width="37.4112" x="43.0056" y="79.8429610098177" height="17.7188389901823" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
166
+ </g>
167
+ <rect width="36.45" x="42.525" y="77.9205610098177" height="18.1994389901823" fill="#8A6EAF" style="opacity: 1.0; stroke: none;"/>
168
+ <g transform="translate(-0.4806, -0.4806)">
169
+ <rect width="37.4112" x="83.025" y="64.7091164095372" height="32.3720835904628" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
170
+ <rect width="37.4112" x="83.5056" y="66.6315164095372" height="30.9302835904628" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
171
+ </g>
172
+ <rect width="36.45" x="83.025" y="64.7091164095372" height="31.4108835904628" fill="#8A6EAF" style="opacity: 1.0; stroke: none;"/>
173
+ <g transform="translate(-0.4806, -0.4806)">
174
+ <rect width="37.4112" x="123.525" y="70.1015427769986" height="26.9796572230014" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
175
+ <rect width="37.4112" x="124.0056" y="72.0239427769986" height="25.5378572230014" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
176
+ </g>
177
+ <rect width="36.45" x="123.525" y="70.1015427769986" height="26.0184572230014" fill="#8A6EAF" style="opacity: 1.0; stroke: none;"/>
178
+ <g transform="translate(-0.4806, -0.4806)">
179
+ <rect width="37.4112" x="164.025" y="50.9584291725105" height="46.1227708274895" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
180
+ <rect width="37.4112" x="164.5056" y="52.8808291725105" height="44.6809708274895" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
181
+ </g>
182
+ <rect width="36.45" x="164.025" y="50.9584291725105" height="45.1615708274895" fill="#8A6EAF" style="opacity: 1.0; stroke: none;"/>
183
+ <g transform="translate(-0.4806, -0.4806)">
184
+ <rect width="37.4112" x="204.525" y="23.1874333800842" height="73.8937666199159" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
185
+ <rect width="37.4112" x="205.0056" y="25.1098333800842" height="72.4519666199159" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
186
+ </g>
187
+ <rect width="36.45" x="204.525" y="23.1874333800842" height="72.9325666199158" fill="#8A6EAF" style="opacity: 1.0; stroke: none;"/>
188
+ <g transform="translate(-0.4806, -0.4806)">
189
+ <rect width="37.4112" x="245.025" y="59.0470687237027" height="38.0341312762973" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
190
+ <rect width="37.4112" x="245.5056" y="60.9694687237027" height="36.5923312762973" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
191
+ </g>
192
+ <rect width="36.45" x="245.025" y="59.0470687237027" height="37.0729312762973" fill="#8A6EAF" style="opacity: 1.0; stroke: none;"/>
193
+ <g transform="translate(-0.4806, -0.4806)">
194
+ <rect width="37.4112" x="285.525" y="72.5281346423562" height="24.5530653576438" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
195
+ <rect width="37.4112" x="286.0056" y="74.4505346423562" height="23.1112653576438" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
196
+ </g>
197
+ <rect width="36.45" x="285.525" y="72.5281346423562" height="23.5918653576438" fill="#8A6EAF" style="opacity: 1.0; stroke: none;"/>
198
+ <g transform="translate(-0.4806, -0.4806)">
199
+ <rect width="37.4112" x="326.025" y="50.4191865357644" height="46.6620134642356" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
200
+ <rect width="37.4112" x="326.5056" y="52.3415865357644" height="45.2202134642356" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
201
+ </g>
202
+ <rect width="36.45" x="326.025" y="50.4191865357644" height="45.7008134642356" fill="#8A6EAF" style="opacity: 1.0; stroke: none;"/>
203
+ <g transform="translate(-0.4806, -0.4806)">
204
+ <rect width="37.4112" x="366.525" y="23.7266760168303" height="73.3545239831697" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
205
+ <rect width="37.4112" x="367.0056" y="25.6490760168303" height="71.9127239831697" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
206
+ </g>
207
+ <rect width="36.45" x="366.525" y="23.7266760168303" height="72.3933239831697" fill="#8A6EAF" style="opacity: 1.0; stroke: none;"/>
208
+ <g transform="translate(-0.4806, -0.4806)">
209
+ <rect width="37.4112" x="407.025" y="70.9104067321178" height="26.1707932678822" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
210
+ <rect width="37.4112" x="407.5056" y="72.8328067321178" height="24.7289932678822" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
211
+ </g>
212
+ <rect width="36.45" x="407.025" y="70.9104067321178" height="25.2095932678822" fill="#8A6EAF" style="opacity: 1.0; stroke: none;"/>
213
+ <g transform="translate(-0.4806, -0.4806)">
214
+ <rect width="37.4112" x="447.525" y="42.8697896213184" height="54.2114103786816" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
215
+ <rect width="37.4112" x="448.0056" y="44.7921896213184" height="52.7696103786816" style="fill: black; fill-opacity: 0.15; stroke: none;"/>
216
+ </g>
217
+ <rect width="36.45" x="447.525" y="42.8697896213184" height="53.2502103786816" fill="#8A6EAF" style="opacity: 1.0; stroke: none;"/>
218
+ </g>
219
+ <g class="graph_layer" id="component_graphs_graph_1">
220
+ <g class="shadow" transform="translate(0.4806, 0.4806)">
221
+ <polyline stroke="black" stroke-width="1.9224" points="0.0,66.5964656381487 44.1818181818182,75.224347826087 88.3636363636364,57.6989621318373 132.545454545455,37.477363253857 176.727272727273,42.8697896213184 220.909090909091,59.0470687237027 265.090909090909,80.6167741935484 309.272727272727,83.3129873772791 353.454545454545,64.4394950911641 397.636363636364,53.1153997194951 441.818181818182,83.5826086956522 486.0,72.7977559607293" fill="transparent" style="fill-opacity: 0; stroke-opacity: 0.35"/>
222
+ <circle r="1.9224" cx="0.0" cy="67.4615456381487" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
223
+ <circle r="1.9224" cx="44.1818181818182" cy="76.089427826087" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
224
+ <circle r="1.9224" cx="88.3636363636364" cy="58.5640421318373" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
225
+ <circle r="1.9224" cx="132.545454545455" cy="38.3424432538569" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
226
+ <circle r="1.9224" cx="176.727272727273" cy="43.7348696213184" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
227
+ <circle r="1.9224" cx="220.909090909091" cy="59.9121487237027" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
228
+ <circle r="1.9224" cx="265.090909090909" cy="81.4818541935484" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
229
+ <circle r="1.9224" cx="309.272727272727" cy="84.1780673772791" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
230
+ <circle r="1.9224" cx="353.454545454545" cy="65.3045750911641" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
231
+ <circle r="1.9224" cx="397.636363636364" cy="53.9804797194951" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
232
+ <circle r="1.9224" cx="441.818181818182" cy="84.4476886956522" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
233
+ <circle r="1.9224" cx="486.0" cy="73.6628359607293" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
234
+ </g>
235
+ <polyline stroke="#72AE6E" stroke-width="1.9224" points="0.0,66.5964656381487 44.1818181818182,75.224347826087 88.3636363636364,57.6989621318373 132.545454545455,37.477363253857 176.727272727273,42.8697896213184 220.909090909091,59.0470687237027 265.090909090909,80.6167741935484 309.272727272727,83.3129873772791 353.454545454545,64.4394950911641 397.636363636364,53.1153997194951 441.818181818182,83.5826086956522 486.0,72.7977559607293" fill="none"/>
236
+ <circle r="1.9224" cx="0.0" cy="66.5964656381487" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
237
+ <circle r="1.9224" cx="44.1818181818182" cy="75.224347826087" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
238
+ <circle r="1.9224" cx="88.3636363636364" cy="57.6989621318373" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
239
+ <circle r="1.9224" cx="132.545454545455" cy="37.477363253857" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
240
+ <circle r="1.9224" cx="176.727272727273" cy="42.8697896213184" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
241
+ <circle r="1.9224" cx="220.909090909091" cy="59.0470687237027" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
242
+ <circle r="1.9224" cx="265.090909090909" cy="80.6167741935484" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
243
+ <circle r="1.9224" cx="309.272727272727" cy="83.3129873772791" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
244
+ <circle r="1.9224" cx="353.454545454545" cy="64.4394950911641" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
245
+ <circle r="1.9224" cx="397.636363636364" cy="53.1153997194951" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
246
+ <circle r="1.9224" cx="441.818181818182" cy="83.5826086956522" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
247
+ <circle r="1.9224" cx="486.0" cy="72.7977559607293" style="stroke-width: 1.9224; stroke: #72AE6E; fill: #72AE6E"/>
248
+ </g>
249
+ <g class="graph_layer" id="component_graphs_graph_2">
250
+ <g class="shadow" transform="translate(0.4806, 0.4806)">
251
+ <polyline stroke="black" stroke-width="1.9224" points="0.0,80.6167741935484 44.1818181818182,83.3129873772791 88.3636363636364,64.4394950911641 132.545454545455,53.1153997194951 176.727272727273,83.5826086956522 220.909090909091,62.8217671809257 265.090909090909,53.1153997194951 309.272727272727,55.2723702664797 353.454545454545,55.8116129032258 397.636363636364,50.9584291725105 441.818181818182,67.4053295932679 486.0,45.5660028050491" fill="transparent" style="fill-opacity: 0; stroke-opacity: 0.35"/>
252
+ <circle r="1.9224" cx="0.0" cy="81.4818541935484" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
253
+ <circle r="1.9224" cx="44.1818181818182" cy="84.1780673772791" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
254
+ <circle r="1.9224" cx="88.3636363636364" cy="65.3045750911641" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
255
+ <circle r="1.9224" cx="132.545454545455" cy="53.9804797194951" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
256
+ <circle r="1.9224" cx="176.727272727273" cy="84.4476886956522" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
257
+ <circle r="1.9224" cx="220.909090909091" cy="63.6868471809257" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
258
+ <circle r="1.9224" cx="265.090909090909" cy="53.9804797194951" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
259
+ <circle r="1.9224" cx="309.272727272727" cy="56.1374502664797" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
260
+ <circle r="1.9224" cx="353.454545454545" cy="56.6766929032258" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
261
+ <circle r="1.9224" cx="397.636363636364" cy="51.8235091725105" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
262
+ <circle r="1.9224" cx="441.818181818182" cy="68.2704095932679" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
263
+ <circle r="1.9224" cx="486.0" cy="46.4310828050491" style="stroke-width: 1.9224; stroke: black; opacity: 0.35;"/>
264
+ </g>
265
+ <polyline stroke="#D1695E" stroke-width="1.9224" points="0.0,80.6167741935484 44.1818181818182,83.3129873772791 88.3636363636364,64.4394950911641 132.545454545455,53.1153997194951 176.727272727273,83.5826086956522 220.909090909091,62.8217671809257 265.090909090909,53.1153997194951 309.272727272727,55.2723702664797 353.454545454545,55.8116129032258 397.636363636364,50.9584291725105 441.818181818182,67.4053295932679 486.0,45.5660028050491" fill="none"/>
266
+ <circle r="1.9224" cx="0.0" cy="80.6167741935484" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
267
+ <circle r="1.9224" cx="44.1818181818182" cy="83.3129873772791" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
268
+ <circle r="1.9224" cx="88.3636363636364" cy="64.4394950911641" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
269
+ <circle r="1.9224" cx="132.545454545455" cy="53.1153997194951" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
270
+ <circle r="1.9224" cx="176.727272727273" cy="83.5826086956522" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
271
+ <circle r="1.9224" cx="220.909090909091" cy="62.8217671809257" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
272
+ <circle r="1.9224" cx="265.090909090909" cy="53.1153997194951" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
273
+ <circle r="1.9224" cx="309.272727272727" cy="55.2723702664797" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
274
+ <circle r="1.9224" cx="353.454545454545" cy="55.8116129032258" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
275
+ <circle r="1.9224" cx="397.636363636364" cy="50.9584291725105" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
276
+ <circle r="1.9224" cx="441.818181818182" cy="67.4053295932679" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
277
+ <circle r="1.9224" cx="486.0" cy="45.5660028050491" style="stroke-width: 1.9224; stroke: #D1695E; fill: #D1695E"/>
278
+ </g>
279
+ </g>
280
+ </g>
281
+ </g>
282
+ <g transform="translate(30.0, 39.6)" id="legend">
283
+ <rect width="7.2" x="140.4" y="0" height="7.2" fill="#6886B4"/>
284
+ <text font-size="0.9216" x="141.552" y="0.6912" fill="white" style="color: white">Jeff</text>
285
+ <rect width="7.2" x="190.8" y="0" height="7.2" fill="#FDD84E"/>
286
+ <text font-size="0.9216" x="191.952" y="0.6912" fill="white" style="color: white">Jerry</text>
287
+ <rect width="7.2" x="248.4" y="0" height="7.2" fill="#8A6EAF"/>
288
+ <text font-size="0.9216" x="249.552" y="0.6912" fill="white" style="color: white">Jack</text>
289
+ <rect width="7.2" x="298.8" y="0" height="7.2" fill="#72AE6E"/>
290
+ <text font-size="0.9216" x="299.952" y="0.6912" fill="white" style="color: white">Brasten</text>
291
+ <rect width="7.2" x="370.8" y="0" height="7.2" fill="#D1695E"/>
292
+ <text font-size="0.9216" x="371.952" y="0.6912" fill="white" style="color: white">Jim</text>
293
+ </g>
294
+ </g>
295
+ </svg>