rgraph-rails 1.0.3 → 1.0.4

Sign up to get free protection for your applications and to get access to all the features.
Files changed (63) hide show
  1. checksums.yaml +8 -8
  2. data/.travis.yml +1 -0
  3. data/README.md +5 -5
  4. data/lib/rgraph-rails/version.rb +1 -1
  5. data/rgraph-rails.gemspec +2 -2
  6. data/vendor/assets/images/bg.png +0 -0
  7. data/vendor/assets/images/bullet.png +0 -0
  8. data/vendor/assets/images/facebook-large.png +0 -0
  9. data/vendor/assets/images/google-plus-large.png +0 -0
  10. data/vendor/assets/images/logo.png +0 -0
  11. data/vendor/assets/images/meter-image-sd-needle.png +0 -0
  12. data/vendor/assets/images/meter-image-sd.png +0 -0
  13. data/vendor/assets/images/meter-sketch-needle.png +0 -0
  14. data/vendor/assets/images/meter-sketch.png +0 -0
  15. data/vendor/assets/images/odometer-background.png +0 -0
  16. data/vendor/assets/images/rgraph.jpg +0 -0
  17. data/vendor/assets/images/title.png +0 -0
  18. data/vendor/assets/images/twitter-large.png +0 -0
  19. data/vendor/assets/javascripts/RGraph.bar.js +258 -30
  20. data/vendor/assets/javascripts/RGraph.bipolar.js +4 -3
  21. data/vendor/assets/javascripts/RGraph.common.annotate.js +4 -3
  22. data/vendor/assets/javascripts/RGraph.common.context.js +4 -3
  23. data/vendor/assets/javascripts/RGraph.common.core.js +227 -105
  24. data/vendor/assets/javascripts/RGraph.common.csv.js +4 -3
  25. data/vendor/assets/javascripts/RGraph.common.deprecated.js +4 -3
  26. data/vendor/assets/javascripts/RGraph.common.dynamic.js +5 -4
  27. data/vendor/assets/javascripts/RGraph.common.effects.js +4 -3
  28. data/vendor/assets/javascripts/RGraph.common.key.js +4 -3
  29. data/vendor/assets/javascripts/RGraph.common.resizing.js +4 -3
  30. data/vendor/assets/javascripts/RGraph.common.sheets.js +357 -0
  31. data/vendor/assets/javascripts/RGraph.common.tooltips.js +6 -4
  32. data/vendor/assets/javascripts/RGraph.common.zoom.js +4 -3
  33. data/vendor/assets/javascripts/RGraph.drawing.background.js +4 -3
  34. data/vendor/assets/javascripts/RGraph.drawing.circle.js +4 -3
  35. data/vendor/assets/javascripts/RGraph.drawing.image.js +4 -3
  36. data/vendor/assets/javascripts/RGraph.drawing.marker1.js +4 -3
  37. data/vendor/assets/javascripts/RGraph.drawing.marker2.js +4 -3
  38. data/vendor/assets/javascripts/RGraph.drawing.marker3.js +1 -1
  39. data/vendor/assets/javascripts/RGraph.drawing.poly.js +1 -1
  40. data/vendor/assets/javascripts/RGraph.drawing.rect.js +1 -1
  41. data/vendor/assets/javascripts/RGraph.drawing.text.js +1 -1
  42. data/vendor/assets/javascripts/RGraph.drawing.xaxis.js +1 -1
  43. data/vendor/assets/javascripts/RGraph.drawing.yaxis.js +33 -30
  44. data/vendor/assets/javascripts/RGraph.fuel.js +14 -16
  45. data/vendor/assets/javascripts/RGraph.funnel.js +1 -1
  46. data/vendor/assets/javascripts/RGraph.gantt.js +1 -1
  47. data/vendor/assets/javascripts/RGraph.gauge.js +3 -5
  48. data/vendor/assets/javascripts/RGraph.hbar.js +738 -212
  49. data/vendor/assets/javascripts/RGraph.hprogress.js +30 -33
  50. data/vendor/assets/javascripts/RGraph.line.js +246 -31
  51. data/vendor/assets/javascripts/RGraph.meter.js +72 -36
  52. data/vendor/assets/javascripts/RGraph.modaldialog.js +1 -1
  53. data/vendor/assets/javascripts/RGraph.odo.js +3 -5
  54. data/vendor/assets/javascripts/RGraph.pie.js +23 -15
  55. data/vendor/assets/javascripts/RGraph.radar.js +1 -1
  56. data/vendor/assets/javascripts/RGraph.rose.js +2 -2
  57. data/vendor/assets/javascripts/RGraph.rscatter.js +116 -27
  58. data/vendor/assets/javascripts/RGraph.scatter.js +14 -15
  59. data/vendor/assets/javascripts/RGraph.thermometer.js +8 -10
  60. data/vendor/assets/javascripts/RGraph.vprogress.js +8 -10
  61. data/vendor/assets/javascripts/RGraph.waterfall.js +1 -1
  62. data/vendor/assets/stylesheets/website.css +32 -2
  63. metadata +6 -5
data/vendor/assets/javascripts/RGraph.common.tooltips.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
@@ -7,8 +7,9 @@
7
7
  * | |
8
8
  * | RGraph is dual licensed under the Open Source GPL (General Public License) |
9
9
  * | v2.0 license and a commercial license which means that you're not bound by |
10
- * | the terms of the GPL. The commercial license is just �99 (GBP) and you can |
11
- * | read about it here: |
10
+ * | the terms of the GPL. The commercial license starts at just �99 (GBP) and |
11
+ * | you can read about it here: |
12
+ * | |
12
13
  * | http://www.rgraph.net/license |
13
14
  * o--------------------------------------------------------------------------------o
14
15
  */
@@ -134,7 +135,7 @@
134
135
  tooltipObj.id = '__rgraph_tooltip_' + obj.canvas.id + '_' + obj.uid + '_'+ idx;
135
136
  tooltipObj.__event__ = obj.Get('chart.tooltips.event') || 'click';
136
137
  tooltipObj.__object__ = obj;
137
-
138
+
138
139
  if (typeof(idx) == 'number') {
139
140
  tooltipObj.__index__ = idx;
140
141
  origIdx = idx;
@@ -171,6 +172,7 @@
171
172
  /**
172
173
  * If the function exists call the object specific tooltip positioning function
173
174
  */
175
+
174
176
  if (typeof(obj.positionTooltip) == 'function') {
175
177
  if (tooltipObj.innerHTML.length > 0) {
176
178
 
data/vendor/assets/javascripts/RGraph.common.zoom.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
@@ -7,8 +7,9 @@
7
7
  * | |
8
8
  * | RGraph is dual licensed under the Open Source GPL (General Public License) |
9
9
  * | v2.0 license and a commercial license which means that you're not bound by |
10
- * | the terms of the GPL. The commercial license is just �99 (GBP) and you can |
11
- * | read about it here: |
10
+ * | the terms of the GPL. The commercial license starts at just �99 (GBP) and |
11
+ * | you can read about it here: |
12
+ * | |
12
13
  * | http://www.rgraph.net/license |
13
14
  * o--------------------------------------------------------------------------------o
14
15
  */
data/vendor/assets/javascripts/RGraph.drawing.background.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
@@ -7,8 +7,9 @@
7
7
  * | |
8
8
  * | RGraph is dual licensed under the Open Source GPL (General Public License) |
9
9
  * | v2.0 license and a commercial license which means that you're not bound by |
10
- * | the terms of the GPL. The commercial license is just �99 (GBP) and you can |
11
- * | read about it here: |
10
+ * | the terms of the GPL. The commercial license starts at just �99 (GBP) and |
11
+ * | you can read about it here: |
12
+ * | |
12
13
  * | http://www.rgraph.net/license |
13
14
  * o--------------------------------------------------------------------------------o
14
15
  */
data/vendor/assets/javascripts/RGraph.drawing.circle.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
@@ -7,8 +7,9 @@
7
7
  * | |
8
8
  * | RGraph is dual licensed under the Open Source GPL (General Public License) |
9
9
  * | v2.0 license and a commercial license which means that you're not bound by |
10
- * | the terms of the GPL. The commercial license is just �99 (GBP) and you can |
11
- * | read about it here: |
10
+ * | the terms of the GPL. The commercial license starts at just �99 (GBP) and |
11
+ * | you can read about it here: |
12
+ * | |
12
13
  * | http://www.rgraph.net/license |
13
14
  * o--------------------------------------------------------------------------------o
14
15
  */
data/vendor/assets/javascripts/RGraph.drawing.image.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
@@ -7,8 +7,9 @@
7
7
  * | |
8
8
  * | RGraph is dual licensed under the Open Source GPL (General Public License) |
9
9
  * | v2.0 license and a commercial license which means that you're not bound by |
10
- * | the terms of the GPL. The commercial license is just �99 (GBP) and you can |
11
- * | read about it here: |
10
+ * | the terms of the GPL. The commercial license starts at just �99 (GBP) and |
11
+ * | you can read about it here: |
12
+ * | |
12
13
  * | http://www.rgraph.net/license |
13
14
  * o--------------------------------------------------------------------------------o
14
15
  */
data/vendor/assets/javascripts/RGraph.drawing.marker1.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
@@ -7,8 +7,9 @@
7
7
  * | |
8
8
  * | RGraph is dual licensed under the Open Source GPL (General Public License) |
9
9
  * | v2.0 license and a commercial license which means that you're not bound by |
10
- * | the terms of the GPL. The commercial license is just �99 (GBP) and you can |
11
- * | read about it here: |
10
+ * | the terms of the GPL. The commercial license starts at just �99 (GBP) and |
11
+ * | you can read about it here: |
12
+ * | |
12
13
  * | http://www.rgraph.net/license |
13
14
  * o--------------------------------------------------------------------------------o
14
15
  */
data/vendor/assets/javascripts/RGraph.drawing.marker2.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
@@ -7,8 +7,9 @@
7
7
  * | |
8
8
  * | RGraph is dual licensed under the Open Source GPL (General Public License) |
9
9
  * | v2.0 license and a commercial license which means that you're not bound by |
10
- * | the terms of the GPL. The commercial license is just �99 (GBP) and you can |
11
- * | read about it here: |
10
+ * | the terms of the GPL. The commercial license starts at just �99 (GBP) and |
11
+ * | you can read about it here: |
12
+ * | |
12
13
  * | http://www.rgraph.net/license |
13
14
  * o--------------------------------------------------------------------------------o
14
15
  */
data/vendor/assets/javascripts/RGraph.drawing.marker3.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
data/vendor/assets/javascripts/RGraph.drawing.poly.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
data/vendor/assets/javascripts/RGraph.drawing.rect.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
data/vendor/assets/javascripts/RGraph.drawing.text.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
data/vendor/assets/javascripts/RGraph.drawing.xaxis.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
data/vendor/assets/javascripts/RGraph.drawing.yaxis.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
@@ -652,15 +652,16 @@
652
652
  gap /= 2;
653
653
  }
654
654
 
655
- RG.Text2(this, {'font':font,
656
- 'size':size,
657
- 'x':x - (align == 'right' ? -5 : 5),
658
- 'y':(i * gap) + this.gutterTop,
659
- 'text':labels_specific[i],
660
- 'valign':'center',
661
- 'halign':align == 'right' ? 'left' : 'right',
662
- 'tag': 'scale'
663
- });
655
+ RG.text2(this, {
656
+ 'font':font,
657
+ 'size':size,
658
+ 'x':x - (align == 'right' ? -5 : 5),
659
+ 'y':(i * gap) + this.gutterTop,
660
+ 'text':labels_specific[i],
661
+ 'valign':'center',
662
+ 'halign':align == 'right' ? 'left' : 'right',
663
+ 'tag': 'scale'
664
+ });
664
665
 
665
666
  /**
666
667
  * Store the max length so that it can be used if necessary to determine
@@ -674,15 +675,16 @@
674
675
  // It's "-2" so that the center label isn't added twice
675
676
  for (var i=(labels_specific.length-2); i>=0; --i) {
676
677
 
677
- RG.Text2(this, {'font':font,
678
- 'size':size,
679
- 'x':x - (align == 'right' ? -5 : 5),
680
- 'y':ca.height - this.gutterBottom - (i * gap),
681
- 'text':labels_specific[i],
682
- 'valign':'center',
683
- 'halign':align == 'right' ? 'left' : 'right',
684
- 'tag': 'scale'
685
- });
678
+ RG.text2(this, {
679
+ 'font':font,
680
+ 'size':size,
681
+ 'x':x - (align == 'right' ? -5 : 5),
682
+ 'y':ca.height - this.gutterBottom - (i * gap),
683
+ 'text':labels_specific[i],
684
+ 'valign':'center',
685
+ 'halign':align == 'right' ? 'left' : 'right',
686
+ 'tag': 'scale'
687
+ });
686
688
  }
687
689
  }
688
690
 
@@ -696,8 +698,8 @@
696
698
  continue;
697
699
  }
698
700
 
699
- var text = RG.number_format(this, original.toFixed(decimals), units_pre, units_post);
700
- var text = String(typeof(formatter) == 'function' ? formatter(this, original) : text);
701
+ var text = RG.number_format(this, original.toFixed(decimals), units_pre, units_post);
702
+ var text = String(typeof(formatter) == 'function' ? formatter(this, original) : text);
701
703
 
702
704
  // text_len is used below for positioning the title
703
705
  var text_len = Math.max(text_len, co.measureText(text).width);
@@ -720,15 +722,16 @@
720
722
  /**
721
723
  * Now - draw the labels
722
724
  */
723
- RG.Text2(this, {'font':font,
724
- 'size':size,
725
- 'x':x - (align == 'right' ? -5 : 5),
726
- 'y':y + this.gutterTop,
727
- 'text':text,
728
- 'valign':'center',
729
- 'halign':align == 'right' ? 'left' : 'right',
730
- 'tag': 'scale'
731
- });
725
+ RG.text2(this, {
726
+ 'font':font,
727
+ 'size':size,
728
+ 'x':x - (align == 'right' ? -5 : 5),
729
+ 'y':y + this.gutterTop,
730
+ 'text':text,
731
+ 'valign':'center',
732
+ 'halign':align == 'right' ? 'left' : 'right',
733
+ 'tag': 'scale'
734
+ });
732
735
 
733
736
 
734
737
 
data/vendor/assets/javascripts/RGraph.fuel.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
@@ -29,24 +29,22 @@
29
29
  * Allow for object config style
30
30
  */
31
31
  if ( typeof conf === 'object'
32
- && typeof conf.min === 'number'
33
- && typeof conf.max === 'number'
34
32
  && typeof conf.id === 'string') {
35
33
 
36
- var id = conf.id
37
- var canvas = document.getElementById(id);
38
- var min = conf.min;
39
- var max = conf.max;
40
- var value = conf.value;
41
- var parseConfObjectForOptions = true; // Set this so the config is parsed (at the end of the constructor)
34
+ var id = conf.id,
35
+ canvas = document.getElementById(id),
36
+ min = conf.min,
37
+ max = conf.max,
38
+ value = conf.value,
39
+ parseConfObjectForOptions = true; // Set this so the config is parsed (at the end of the constructor)
42
40
 
43
41
  } else {
44
42
 
45
- var id = conf;
46
- var canvas = document.getElementById(id);
47
- var min = arguments[1];
48
- var max = arguments[2];
49
- var value = arguments[3];
43
+ var id = conf,
44
+ canvas = document.getElementById(id),
45
+ min = arguments[1],
46
+ max = arguments[2],
47
+ value = arguments[3];
50
48
  }
51
49
 
52
50
  // Get the canvas and context objects
@@ -56,8 +54,8 @@
56
54
  this.canvas.__object__ = this;
57
55
  this.type = 'fuel';
58
56
  this.isRGraph = true;
59
- this.min = min;
60
- this.max = max;
57
+ this.min = RGraph.stringsToNumbers(min);
58
+ this.max = RGraph.stringsToNumbers(max);
61
59
  this.value = RGraph.stringsToNumbers(value);
62
60
  this.angles = {};
63
61
  this.currentValue = null;
data/vendor/assets/javascripts/RGraph.funnel.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
data/vendor/assets/javascripts/RGraph.gantt.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
data/vendor/assets/javascripts/RGraph.gauge.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
@@ -28,8 +28,6 @@
28
28
  * Allow for object config style
29
29
  */
30
30
  if ( typeof conf === 'object'
31
- && typeof conf.min === 'number'
32
- && typeof conf.max === 'number'
33
31
  && typeof conf.id === 'string') {
34
32
 
35
33
  var id = conf.id
@@ -54,8 +52,8 @@
54
52
  this.context = this.canvas.getContext ? this.canvas.getContext("2d", {alpha: (typeof id === 'object' && id.alpha === false) ? false : true}) : null;
55
53
  this.canvas.__object__ = this;
56
54
  this.type = 'gauge';
57
- this.min = min;
58
- this.max = max;
55
+ this.min = RGraph.stringsToNumbers(min);
56
+ this.max = RGraph.stringsToNumbers(max);
59
57
  this.value = RGraph.stringsToNumbers(value);
60
58
  this.isRGraph = true;
61
59
  this.currentValue = null;
data/vendor/assets/javascripts/RGraph.hbar.js CHANGED
@@ -1,4 +1,4 @@
1
- // version: 2015-11-02
1
+ // version: 2016-02-06
2
2
  /**
3
3
  * o--------------------------------------------------------------------------------o
4
4
  * | This file is part of the RGraph package - you can learn more at: |
@@ -7,8 +7,9 @@
7
7
  * | |
8
8
  * | RGraph is dual licensed under the Open Source GPL (General Public License) |
9
9
  * | v2.0 license and a commercial license which means that you're not bound by |
10
- * | the terms of the GPL. The commercial license is just �99 (GBP) and you can |
11
- * | read about it here: |
10
+ * | the terms of the GPL. The commercial license starts at just �99 (GBP) and |
11
+ * | you can read about it here: |
12
+ * | |
12
13
  * | http://www.rgraph.net/license |
13
14
  * o--------------------------------------------------------------------------------o
14
15
  */
@@ -62,6 +63,7 @@
62
63
  this.firstDraw = true; // After the first draw this will be false
63
64
 
64
65
 
66
+
65
67
  /**
66
68
  * Compatibility with older browsers
67
69
  */
@@ -198,6 +200,7 @@
198
200
  'chart.scale.point': '.',
199
201
  'chart.scale.thousand': ',',
200
202
  'chart.scale.decimals': null,
203
+ 'chart.scale.zerostart': false,
201
204
  'chart.noredraw': false,
202
205
  'chart.events.click': null,
203
206
  'chart.events.mousemove': null,
@@ -207,7 +210,15 @@
207
210
  'chart.noxtickmarks': false,
208
211
  'chart.noytickmarks': false,
209
212
  'chart.numyticks': data.length,
210
- 'chart.numxticks': 10
213
+ 'chart.numxticks': 10,
214
+ 'chart.variant': 'hbar',
215
+ 'chart.variant.threed.angle': 0.1,
216
+ 'chart.variant.threed.offsetx': 10,
217
+ 'chart.variant.threed.offsety': 5,
218
+ 'chart.variant.threed.xaxis': true,
219
+ 'chart.variant.threed.yaxis': true,
220
+ 'chart.yaxispos': 'left',
221
+ 'chart.variant': 'hbar'
211
222
  }
212
223
 
213
224
  // Check for support
@@ -236,7 +247,7 @@
236
247
  /**
237
248
  * Create the linear data array
238
249
  */
239
- this.data_arr = RGraph.array_linearize(this.data);
250
+ this.data_arr = RGraph.arrayLinearize(this.data);
240
251
 
241
252
 
242
253
  /**
@@ -316,7 +327,7 @@
316
327
  if (name == 'chart.labels.abovebar') {
317
328
  name = 'chart.labels.above';
318
329
  }
319
-
330
+
320
331
  prop[name] = value;
321
332
 
322
333
  return this;
@@ -367,7 +378,24 @@
367
378
  * Fire the onbeforedraw event
368
379
  */
369
380
  RG.FireCustomEvent(this, 'onbeforedraw');
370
-
381
+
382
+
383
+
384
+
385
+ //
386
+ // If the chart is 3d then angle it it
387
+ //
388
+ if (prop['chart.variant'] === '3d') {
389
+ co.setTransform(1,prop['chart.variant.threed.angle'],0,1,0.5,0.5);
390
+
391
+ // Enlarge the gutter if its 25
392
+ if (prop['chart.gutter.bottom'] === 25) {
393
+ this.set('gutterBottom', 80);
394
+ }
395
+ }
396
+
397
+
398
+
371
399
 
372
400
  /**
373
401
  * Parse the colors. This allows for simple gradient syntax
@@ -421,7 +449,10 @@
421
449
  this.gutterRight = prop['chart.gutter.right'];
422
450
  this.gutterTop = prop['chart.gutter.top'];
423
451
  this.gutterBottom = prop['chart.gutter.bottom'];
424
-
452
+
453
+
454
+
455
+
425
456
  /**
426
457
  * Stop the coords array from growing uncontrollably
427
458
  */
@@ -446,6 +477,7 @@
446
477
  this.graphheight = ca.height - this.gutterTop - this.gutterBottom;
447
478
  this.halfgrapharea = this.grapharea / 2;
448
479
  this.halfTextHeight = prop['chart.text.size'] / 2;
480
+ this.halfway = ma.round((this.graphwidth / 2) + this.gutterLeft)
449
481
 
450
482
 
451
483
 
@@ -539,13 +571,21 @@
539
571
  this.drawAxes =
540
572
  this.DrawAxes = function ()
541
573
  {
542
- var halfway = ma.round((this.graphwidth / 2) + this.gutterLeft);
543
-
574
+ var halfway = this.halfway
575
+
576
+
577
+
578
+
579
+
580
+
544
581
  co.beginPath();
545
582
 
546
583
  co.lineWidth = prop['chart.axis.linewidth'] ? prop['chart.axis.linewidth'] + 0.001 : 1.001;
547
584
  co.strokeStyle = prop['chart.axis.color'];
548
-
585
+
586
+
587
+
588
+
549
589
  // Draw the Y axis
550
590
  if (prop['chart.noyaxis'] == false && prop['chart.noaxes'] == false) {
551
591
  if (prop['chart.yaxispos'] == 'center') {
@@ -677,10 +717,10 @@
677
717
  this.drawLabels =
678
718
  this.DrawLabels = function ()
679
719
  {
680
- var units_pre = prop['chart.units.pre'];
681
- var units_post = prop['chart.units.post'];
682
- var text_size = prop['chart.text.size'];
683
- var font = prop['chart.text.font'];
720
+ var units_pre = prop['chart.units.pre'],
721
+ units_post = prop['chart.units.post'],
722
+ text_size = prop['chart.text.size'],
723
+ font = prop['chart.text.font'];
684
724
 
685
725
 
686
726
 
@@ -784,61 +824,68 @@
784
824
  if (prop['chart.yaxispos'] == 'center') {
785
825
 
786
826
  for (var i=0; i<this.scale2.labels.length; ++i) {
787
- RG.Text2(this, {'font':font,
788
- 'size':text_size,
789
- 'x':this.gutterLeft + (this.graphwidth / 2) - ((this.graphwidth / 2) * ((i+1)/this.scale2.labels.length)),
790
- 'y':this.gutterTop + this.halfTextHeight + this.graphheight + gap,
791
- 'text':'-' + this.scale2.labels[i],
792
- 'valign':'center',
793
- 'halign':'center',
794
- 'tag': 'scale'});
827
+ RG.text2(this, {
828
+ 'font':font,
829
+ 'size':text_size,
830
+ 'x':this.gutterLeft + (this.graphwidth / 2) - ((this.graphwidth / 2) * ((i+1)/this.scale2.labels.length)),
831
+ 'y':this.gutterTop + this.halfTextHeight + this.graphheight + gap,
832
+ 'text':'-' + this.scale2.labels[i],
833
+ 'valign':'center',
834
+ 'halign':'center',
835
+ 'tag': 'scale'
836
+ });
795
837
  }
796
838
 
797
839
  for (var i=0; i<this.scale2.labels.length; ++i) {
798
- RG.Text2(this, {'font':font,
799
- 'size':text_size,
800
- 'x':this.gutterLeft + ((this.graphwidth / 2) * ((i+1)/this.scale2.labels.length)) + (this.graphwidth / 2),
801
- 'y':this.gutterTop + this.halfTextHeight + this.graphheight + gap,
802
- 'text':this.scale2.labels[i],
803
- 'valign':'center',
804
- 'halign':'center',
805
- 'tag': 'scale'});
840
+ RG.text2(this, {
841
+ 'font':font,
842
+ 'size':text_size,
843
+ 'x':this.gutterLeft + ((this.graphwidth / 2) * ((i+1)/this.scale2.labels.length)) + (this.graphwidth / 2),
844
+ 'y':this.gutterTop + this.halfTextHeight + this.graphheight + gap,
845
+ 'text':this.scale2.labels[i],
846
+ 'valign':'center',
847
+ 'halign':'center',
848
+ 'tag': 'scale'
849
+ });
806
850
  }
807
851
 
808
852
  }else if (prop['chart.yaxispos'] == 'right') {
809
853
 
810
854
 
811
855
  for (var i=0,len=this.scale2.labels.length; i<len; ++i) {
812
- RG.Text2(this, {'font':font,
813
- 'size':text_size,
814
- 'x':this.gutterLeft + (i * (this.graphwidth / len)),
815
- 'y':this.gutterTop + this.halfTextHeight + this.graphheight + gap,
816
- 'text':'-' + this.scale2.labels[len - 1 - i],
817
- 'valign':'center',
818
- 'halign':'center',
819
- 'tag': 'scale'
820
- });
856
+ RG.Text2(this, {
857
+ 'font':font,
858
+ 'size':text_size,
859
+ 'x':this.gutterLeft + (i * (this.graphwidth / len)),
860
+ 'y':this.gutterTop + this.halfTextHeight + this.graphheight + gap,
861
+ 'text':'-' + this.scale2.labels[len - 1 - i],
862
+ 'valign':'center',
863
+ 'halign':'center',
864
+ 'tag': 'scale'
865
+ });
821
866
  }
822
867
 
868
+
823
869
  } else {
824
870
  for (var i=0,len=this.scale2.labels.length; i<len; ++i) {
825
- RG.Text2(this, {'font':font,
826
- 'size':text_size,
827
- 'x':this.gutterLeft + (this.graphwidth * ((i+1)/len)),
828
- 'y':this.gutterTop + this.halfTextHeight + this.graphheight + gap,
829
- 'text':this.scale2.labels[i],
830
- 'valign':'center',
831
- 'halign':'center',
832
- 'tag': 'scale'
833
- });
871
+ RG.Text2(this, {
872
+ 'font':font,
873
+ 'size':text_size,
874
+ 'x':this.gutterLeft + (this.graphwidth * ((i+1)/len)),
875
+ 'y':this.gutterTop + this.halfTextHeight + this.graphheight + gap,
876
+ 'text':this.scale2.labels[i],
877
+ 'valign':'center',
878
+ 'halign':'center',
879
+ 'tag': 'scale'
880
+ });
834
881
  }
835
882
  }
836
883
 
837
884
  /**
838
885
  * If xmin is not zero - draw that
839
886
  */
840
- if (prop['chart.xmin'] > 0 || prop['chart.noyaxis'] == true) {
841
-
887
+ if (prop['chart.xmin'] > 0 || prop['chart.noyaxis'] == true || prop['chart.scale.zerostart'] || prop['chart.noaxes']) {
888
+
842
889
  var x = prop['chart.yaxispos'] == 'center' ? this.gutterLeft + (this.graphwidth / 2): this.gutterLeft;
843
890
 
844
891
  /**
@@ -848,28 +895,35 @@
848
895
  var x = ca.width - this.gutterRight;
849
896
  }
850
897
 
851
- RG.Text2(this, {'font':font,
852
- 'size':text_size,
853
- 'x':x,
854
- 'y':this.gutterTop + this.halfTextHeight + this.graphheight + gap,
855
- 'text':RG.number_format(this, prop['chart.xmin'].toFixed(prop['chart.scale.decimals']), units_pre, units_post),
856
- 'valign':'center',
857
- 'halign':'center',
858
- 'tag': 'scale'
859
- });
898
+ RG.text2(this, {
899
+ 'font':font,
900
+ 'size':text_size,
901
+ 'x':x,
902
+ 'y':this.gutterTop + this.halfTextHeight + this.graphheight + gap,
903
+ 'text':RG.numberFormat(this, prop['chart.xmin'].toFixed(prop['chart.scale.decimals']), units_pre, units_post),
904
+ 'valign':'center',
905
+ 'halign':'center',
906
+ 'tag': 'scale'
907
+ });
860
908
  }
861
909
 
862
910
  co.fill();
863
911
  co.stroke();
864
912
  }
865
913
  }
866
-
914
+
915
+
916
+
917
+
918
+
919
+
920
+
867
921
  /**
868
922
  * The Y axis labels
869
923
  */
870
- if (typeof(prop['chart.labels']) == 'object') {
924
+ if (typeof prop['chart.labels'] == 'object') {
871
925
 
872
- var xOffset = 5,
926
+ var xOffset = prop['chart.variant'] === '3d' && prop['chart.yaxispos'] === 'right' ? 15 : 5,
873
927
  font = prop['chart.text.font'],
874
928
  color = prop['chart.labels.color'] || prop['chart.text.color'],
875
929
  bold = prop['chart.labels.bold']
@@ -918,7 +972,8 @@
918
972
 
919
973
 
920
974
  /**
921
- * This function draws the bars
975
+ * This function draws the bars. It also draw 3D axes as the axes drawing bit
976
+ * is don AFTER the bars are drawn
922
977
  */
923
978
  this.drawbars =
924
979
  this.Drawbars = function ()
@@ -926,25 +981,29 @@
926
981
  co.lineWidth = prop['chart.linewidth'];
927
982
  co.strokeStyle = prop['chart.strokestyle'];
928
983
  co.fillStyle = prop['chart.colors'][0];
929
- var prevX = 0;
930
- var prevY = 0;
984
+
985
+ var prevX = 0,
986
+ prevY = 0;
987
+
931
988
 
932
989
  /**
933
990
  * Work out the max value
934
991
  */
935
992
  if (prop['chart.xmax']) {
936
993
 
937
- this.scale2 = RG.getScale2(this, {'max':prop['chart.xmax'],
938
- 'min':prop['chart.xmin'],
939
- 'scale.decimals':Number(prop['chart.scale.decimals']),
940
- 'scale.point':prop['chart.scale.point'],
941
- 'scale.thousand':prop['chart.scale.thousand'],
942
- 'scale.round':prop['chart.scale.round'],
943
- 'units.pre':prop['chart.units.pre'],
944
- 'units.post':prop['chart.units.post'],
945
- 'ylabels.count':prop['chart.xlabels.count'],
946
- 'strict':true
947
- });
994
+ this.scale2 = RG.getScale2(this, {
995
+ 'max':prop['chart.xmax'],
996
+ 'min':prop['chart.xmin'],
997
+ 'scale.decimals':Number(prop['chart.scale.decimals']),
998
+ 'scale.point':prop['chart.scale.point'],
999
+ 'scale.thousand':prop['chart.scale.thousand'],
1000
+ 'scale.round':prop['chart.scale.round'],
1001
+ 'units.pre':prop['chart.units.pre'],
1002
+ 'units.post':prop['chart.units.post'],
1003
+ 'ylabels.count':prop['chart.xlabels.count'],
1004
+ 'strict':true
1005
+ });
1006
+
948
1007
  this.max = this.scale2.max;
949
1008
 
950
1009
  } else {
@@ -955,23 +1014,24 @@
955
1014
  if (typeof(this.data[i]) == 'object') {
956
1015
  var value = grouping == 'grouped' ? Number(RG.array_max(this.data[i], true)) : Number(RG.array_sum(this.data[i])) ;
957
1016
  } else {
958
- var value = Number(Math.abs(this.data[i]));
1017
+ var value = Number(ma.abs(this.data[i]));
959
1018
  }
960
1019
 
961
1020
  this.max = ma.max(Math.abs(this.max), Math.abs(value));
962
1021
  }
963
1022
 
964
- this.scale2 = RG.getScale2(this, {'max':this.max,
965
- 'min':prop['chart.xmin'],
966
- 'scale.decimals':Number(prop['chart.scale.decimals']),
967
- 'scale.point':prop['chart.scale.point'],
968
- 'scale.thousand':prop['chart.scale.thousand'],
969
- 'scale.round':prop['chart.scale.round'],
970
- 'units.pre':prop['chart.units.pre'],
971
- 'units.post':prop['chart.units.post'],
972
- 'ylabels.count':prop['chart.xlabels.count']
973
- });
974
-
1023
+ this.scale2 = RG.getScale2(this, {
1024
+ 'max':this.max,
1025
+ 'min':prop['chart.xmin'],
1026
+ 'scale.decimals':Number(prop['chart.scale.decimals']),
1027
+ 'scale.point':prop['chart.scale.point'],
1028
+ 'scale.thousand':prop['chart.scale.thousand'],
1029
+ 'scale.round':prop['chart.scale.round'],
1030
+ 'units.pre':prop['chart.units.pre'],
1031
+ 'units.post':prop['chart.units.post'],
1032
+ 'ylabels.count':prop['chart.xlabels.count']
1033
+ });
1034
+
975
1035
 
976
1036
  this.max = this.scale2.max;
977
1037
  this.min = this.scale2.min;
@@ -988,6 +1048,15 @@
988
1048
 
989
1049
 
990
1050
 
1051
+ // Draw the 3d axes if necessary
1052
+ if (prop['chart.variant'] === '3d') {
1053
+ RG.draw3DAxes(this);
1054
+ }
1055
+
1056
+
1057
+
1058
+
1059
+
991
1060
 
992
1061
  /**
993
1062
  * The bars are drawn HERE
@@ -995,8 +1064,8 @@
995
1064
  var graphwidth = (ca.width - this.gutterLeft - this.gutterRight);
996
1065
  var halfwidth = graphwidth / 2;
997
1066
 
998
- for (i=0,len=this.data.length; i<len; ++i) {
999
-
1067
+ for (i=(len=this.data.length-1); i>=0; --i) {
1068
+
1000
1069
  // Work out the width and height
1001
1070
  var width = ma.abs((this.data[i] / this.max) * graphwidth);
1002
1071
  var height = this.graphheight / this.data.length;
@@ -1027,16 +1096,18 @@
1027
1096
  co.shadowOffsetX = prop['chart.shadow.offsetx'];
1028
1097
  co.shadowOffsetY = prop['chart.shadow.offsety'];
1029
1098
  }
1030
-
1099
+
1031
1100
  /**
1032
1101
  * Draw the bar
1033
1102
  */
1034
1103
  co.beginPath();
1035
- if (typeof(this.data[i]) == 'number') {
1036
-
1037
- var barHeight = height - (2 * vmargin);
1038
- var barWidth = ((this.data[i] - prop['chart.xmin']) / (this.max - prop['chart.xmin'])) * this.graphwidth;
1039
- var barX = this.gutterLeft;
1104
+
1105
+ // Standard (non-grouped and non-stacked) bars here
1106
+ if (typeof this.data[i] == 'number' || RG.isNull(this.data[i])) {
1107
+
1108
+ var barHeight = height - (2 * vmargin),
1109
+ barWidth = ((this.data[i] - prop['chart.xmin']) / (this.max - prop['chart.xmin'])) * this.graphwidth,
1110
+ barX = this.gutterLeft;
1040
1111
 
1041
1112
  // Account for Y axis pos
1042
1113
  if (prop['chart.yaxispos'] == 'center') {
@@ -1044,42 +1115,155 @@
1044
1115
  barX += halfwidth;
1045
1116
 
1046
1117
  if (this.data[i] < 0) {
1047
- barWidth = (Math.abs(this.data[i]) - prop['chart.xmin']) / (this.max - prop['chart.xmin']);
1118
+ barWidth = (ma.abs(this.data[i]) - prop['chart.xmin']) / (this.max - prop['chart.xmin']);
1048
1119
  barWidth = barWidth * (this.graphwidth / 2);
1049
1120
  barX = ((this.graphwidth / 2) + this.gutterLeft) - barWidth;
1050
1121
  }
1051
1122
 
1052
1123
  } else if (prop['chart.yaxispos'] == 'right') {
1053
1124
 
1054
- barWidth = Math.abs(barWidth);
1125
+ barWidth = ma.abs(barWidth);
1055
1126
  barX = ca.width - this.gutterRight - barWidth;
1127
+
1056
1128
  }
1057
1129
 
1058
1130
  // Set the fill color
1059
1131
  co.strokeStyle = prop['chart.strokestyle'];
1060
- co.fillStyle = prop['chart.colors'][0];
1061
-
1132
+ co.fillStyle = prop['chart.colors'][0];
1133
+
1062
1134
  // Sequential colors
1063
1135
  if (prop['chart.colors.sequential']) {
1064
1136
  co.fillStyle = prop['chart.colors'][colorIdx++];
1065
1137
  }
1066
1138
 
1139
+
1140
+
1141
+
1142
+
1143
+
1144
+
1145
+
1146
+
1147
+
1148
+
1149
+
1150
+
1151
+
1152
+
1153
+
1067
1154
  co.strokeRect(barX, this.gutterTop + (i * height) + prop['chart.vmargin'], barWidth, barHeight);
1068
1155
  co.fillRect(barX, this.gutterTop + (i * height) + prop['chart.vmargin'], barWidth, barHeight);
1069
1156
 
1070
- this.coords.push([barX,
1071
- y + vmargin,
1072
- barWidth,
1073
- height - (2 * vmargin),
1074
- co.fillStyle,
1075
- this.data[i],
1076
- true]);
1077
-
1157
+
1158
+
1159
+
1160
+
1161
+
1162
+
1163
+
1164
+
1165
+
1166
+
1167
+
1168
+
1169
+
1170
+
1171
+
1172
+
1173
+
1174
+
1175
+
1176
+
1177
+
1178
+
1179
+
1180
+ this.coords.push([
1181
+ barX,
1182
+ y + vmargin,
1183
+ barWidth,
1184
+ height - (2 * vmargin),
1185
+ co.fillStyle,
1186
+ this.data[i],
1187
+ true
1188
+ ]);
1189
+
1190
+
1191
+
1192
+
1193
+
1194
+
1195
+ // Draw the 3D effect using the coords that have just been stored
1196
+ if (prop['chart.variant'] === '3d' && typeof this.data[i] == 'number') {
1197
+
1198
+
1199
+ var prevStrokeStyle = co.strokeStyle,
1200
+ prevFillStyle = co.fillStyle;
1201
+
1202
+ /**
1203
+ * Turn off the shadow for the 3D bits
1204
+ */
1205
+ RG.noShadow(this);
1206
+
1207
+ // DRAW THE 3D BITS HERE
1208
+ var barX = barX,
1209
+ barY = y + vmargin,
1210
+ barW = barWidth,
1211
+ barH = height - (2 * vmargin),
1212
+ offsetX = prop['chart.variant.threed.offsetx'],
1213
+ offsetY = prop['chart.variant.threed.offsety'],
1214
+ value = this.data[i];
1215
+
1216
+
1217
+ pa2(
1218
+ co,
1219
+ [
1220
+ 'b',
1221
+ 'm', barX, barY,
1222
+ 'l', barX + offsetX - (prop['chart.yaxispos'] == 'left' && value < 0 ? offsetX : 0), barY - offsetY,
1223
+ 'l', barX + barW + offsetX - (prop['chart.yaxispos'] == 'center' && value < 0 ? offsetX : 0), barY - offsetY,
1224
+ 'l', barX + barW, barY,
1225
+ 'c',
1226
+ 's', co.strokeStyle,
1227
+ 'f', co.fillStyle,
1228
+ 'f','rgba(255,255,255,0.6)'//Fill again to lighten it
1229
+ ]
1230
+ );
1231
+
1232
+ if ( prop['chart.yaxispos'] !== 'right'
1233
+ && !(prop['chart.yaxispos'] === 'center' && value < 0)
1234
+ && value >= 0
1235
+ && !RG.isNull(value)
1236
+ ) {
1237
+
1238
+ pa2(
1239
+ co,
1240
+ [
1241
+ 'b',
1242
+ 'fs', prevFillStyle,
1243
+ 'm', barX + barW, barY,
1244
+ 'l', barX + barW + offsetX, barY - offsetY,
1245
+ 'l', barX + barW + offsetX, barY - offsetY + barH,
1246
+ 'l', barX + barW, barY + barH,
1247
+ 'c',
1248
+ 's', co.strokeStyle,
1249
+ 'f', prevFillStyle,
1250
+ 'f', 'rgba(0,0,0,0.25)'
1251
+ ]
1252
+ );
1253
+ }
1254
+
1255
+ }
1256
+
1257
+
1258
+
1259
+
1260
+
1261
+
1078
1262
  /**
1079
1263
  * Stacked bar chart
1080
1264
  */
1081
1265
  } else if (typeof(this.data[i]) == 'object' && prop['chart.grouping'] == 'stacked') {
1082
-
1266
+
1083
1267
  if (prop['chart.yaxispos'] == 'center') {
1084
1268
  alert('[HBAR] You can\'t have a stacked chart with the Y axis in the center, change it to grouped');
1085
1269
  } else if (prop['chart.yaxispos'] == 'right') {
@@ -1091,10 +1275,27 @@
1091
1275
  if (typeof this.coords2[i] == 'undefined') {
1092
1276
  this.coords2[i] = [];
1093
1277
  }
1094
-
1278
+
1095
1279
  for (j=0; j<this.data[i].length; ++j) {
1096
1280
 
1281
+ // The previous 3D segments would have turned the shadow off - so turn it back on
1282
+ if (prop['chart.shadow'] && prop['chart.variant'] === '3d') {
1283
+ co.shadowColor = prop['chart.shadow.color'];
1284
+ co.shadowBlur = prop['chart.shadow.blur'];
1285
+ co.shadowOffsetX = prop['chart.shadow.offsetx'];
1286
+ co.shadowOffsetY = prop['chart.shadow.offsety'];
1287
+ }
1288
+
1289
+ //
1290
+ // Ensure the number is positive
1291
+ //(even though having the X axis on the right implies a
1292
+ //negative value)
1293
+ //
1294
+ if (!RG.isNull(this.data[i][j])) this.data[i][j] = ma.abs(this.data[i][j]);
1295
+
1097
1296
 
1297
+ var last = (j === (this.data[i].length - 1) );
1298
+
1098
1299
  // Set the fill/stroke colors
1099
1300
  co.strokeStyle = prop['chart.strokestyle'];
1100
1301
  co.fillStyle = prop['chart.colors'][j];
@@ -1117,39 +1318,124 @@
1117
1318
 
1118
1319
  co.strokeRect(x, this.gutterTop + prop['chart.vmargin'] + (this.graphheight / this.data.length) * i, width, height - (2 * vmargin) );
1119
1320
  co.fillRect(x, this.gutterTop + prop['chart.vmargin'] + (this.graphheight / this.data.length) * i, width, height - (2 * vmargin) );
1120
-
1321
+
1322
+
1121
1323
  /**
1122
1324
  * Store the coords for tooltips
1123
1325
  */
1124
1326
 
1125
1327
  // The last property of this array is a boolean which tells you whether the value is the last or not
1126
- this.coords.push([x,
1127
- y + vmargin,
1128
- width,
1129
- height - (2 * vmargin),
1130
- co.fillStyle,
1131
- RG.array_sum(this.data[i]),
1132
- j == (this.data[i].length - 1)
1133
- ]);
1134
- this.coords2[i].push([x,
1135
- y + vmargin,
1136
- width,
1137
- height - (2 * vmargin),
1138
- co.fillStyle,
1139
- RG.array_sum(this.data[i]),
1140
- j == (this.data[i].length - 1)
1141
- ]);
1328
+ this.coords.push([
1329
+ x,
1330
+ y + vmargin,
1331
+ width,
1332
+ height - (2 * vmargin),
1333
+ co.fillStyle,
1334
+ RG.array_sum(this.data[i]),
1335
+ j == (this.data[i].length - 1)
1336
+ ]);
1337
+
1338
+ this.coords2[i].push([
1339
+ x,
1340
+ y + vmargin,
1341
+ width,
1342
+ height - (2 * vmargin),
1343
+ co.fillStyle,
1344
+ RG.array_sum(this.data[i]),
1345
+ j == (this.data[i].length - 1)
1346
+ ]);
1347
+
1348
+
1349
+
1350
+
1351
+
1352
+
1353
+ // 3D effect
1354
+ if (prop['chart.variant'] === '3d') {
1355
+
1356
+ /**
1357
+ * Turn off the shadow for the 3D bits
1358
+ */
1359
+ RG.noShadow(this);
1360
+
1361
+ var prevStrokeStyle = co.strokeStyle,
1362
+ prevFillStyle = co.fillStyle;
1363
+
1364
+ // DRAW THE 3D BITS HERE
1365
+ var barX = x,
1366
+ barY = y + vmargin,
1367
+ barW = width,
1368
+ barH = height - (2 * vmargin),
1369
+ offsetX = prop['chart.variant.threed.offsetx'],
1370
+ offsetY = prop['chart.variant.threed.offsety'],
1371
+ value = this.data[i][j];
1372
+
1373
+ if (!RG.isNull(value)) {
1374
+ pa2(
1375
+ co,
1376
+ [
1377
+ 'b',
1378
+ 'm', barX, barY,
1379
+ 'l', barX + offsetX, barY - offsetY,
1380
+ 'l', barX + barW + offsetX, barY - offsetY,
1381
+ 'l', barX + barW, barY,
1382
+ 'c',
1383
+ 's', co.strokeStyle,
1384
+ 'f', co.fillStyle,
1385
+ 'f','rgba(255,255,255,0.6)'//Fill again to lighten it
1386
+ ]
1387
+ );
1388
+ }
1389
+
1390
+ if ( prop['chart.yaxispos'] !== 'right'
1391
+ && !(prop['chart.yaxispos'] === 'center' && value < 0)
1392
+ && !RG.isNull(value)
1393
+ ) {
1394
+
1395
+ pa2(
1396
+ co,
1397
+ [
1398
+ 'fs', prevFillStyle,
1399
+ 'b',
1400
+ 'm', barX + barW, barY,
1401
+ 'l', barX + barW + offsetX, barY - offsetY,
1402
+ 'l', barX + barW + offsetX, barY - offsetY + barH,
1403
+ 'l', barX + barW, barY + barH,
1404
+ 'c',
1405
+ 's', co.strokeStyle,
1406
+ 'f', prevFillStyle,
1407
+ 'f', 'rgba(0,0,0,0.25)'
1408
+ ]
1409
+ );
1410
+ }
1411
+
1412
+ co.beginPath();
1413
+ co.strokeStyle = prevStrokeStyle;
1414
+ co.fillStyle = prevFillStyle;
1415
+ }
1416
+
1417
+
1418
+
1419
+
1420
+
1142
1421
 
1143
1422
  if (prop['chart.yaxispos'] !== 'right') {
1144
1423
  x += width;
1145
1424
  }
1146
1425
  }
1147
-
1426
+
1427
+
1428
+
1429
+
1430
+
1431
+
1432
+
1433
+
1148
1434
  /**
1149
1435
  * A grouped bar chart
1150
1436
  */
1151
1437
  } else if (typeof(this.data[i]) == 'object' && prop['chart.grouping'] == 'grouped') {
1152
-
1438
+
1153
1439
  var vmarginGrouped = prop['chart.vmargin.grouped'];
1154
1440
  var individualBarHeight = ((height - (2 * vmargin) - ((this.data[i].length - 1) * vmarginGrouped)) / this.data[i].length)
1155
1441
 
@@ -1157,8 +1443,8 @@
1157
1443
  this.coords2[i] = [];
1158
1444
  }
1159
1445
 
1160
- for (j=0; j<this.data[i].length; ++j) {
1161
-
1446
+ for (j=(this.data[i].length - 1); j>=0; --j) {
1447
+
1162
1448
 
1163
1449
  /**
1164
1450
  * Turn on the shadow if need be
@@ -1202,22 +1488,115 @@
1202
1488
 
1203
1489
  co.strokeRect(startX, startY, width, individualBarHeight);
1204
1490
  co.fillRect(startX, startY, width, individualBarHeight);
1491
+
1492
+
1493
+
1494
+
1495
+
1496
+
1497
+ this.coords.push([
1498
+ startX,
1499
+ startY,
1500
+ width,
1501
+ individualBarHeight,
1502
+ co.fillStyle,
1503
+ this.data[i][j],
1504
+ true
1505
+ ]);
1205
1506
 
1206
- this.coords.push([startX,
1207
- startY,
1208
- width,
1209
- individualBarHeight,
1210
- co.fillStyle,
1211
- this.data[i][j],
1212
- true]);
1213
-
1214
- this.coords2[i].push([startX,
1215
- startY,
1216
- width,
1217
- individualBarHeight,
1218
- co.fillStyle,
1219
- this.data[i][j],
1220
- true]);
1507
+ this.coords2[i].push([
1508
+ startX,
1509
+ startY,
1510
+ width,
1511
+ individualBarHeight,
1512
+ co.fillStyle,
1513
+ this.data[i][j],
1514
+ true
1515
+ ]);
1516
+
1517
+
1518
+
1519
+
1520
+
1521
+
1522
+
1523
+
1524
+
1525
+
1526
+
1527
+
1528
+ // 3D effect
1529
+ if (prop['chart.variant'] === '3d') {
1530
+
1531
+ /**
1532
+ * Turn off the shadow for the 3D bits
1533
+ */
1534
+ RG.noShadow(this);
1535
+
1536
+ var prevStrokeStyle = co.strokeStyle,
1537
+ prevFillStyle = co.fillStyle;
1538
+
1539
+ // DRAW THE 3D BITS HERE
1540
+ var barX = startX,
1541
+ barY = startY,
1542
+ barW = width,
1543
+ barH = individualBarHeight,
1544
+ offsetX = prop['chart.variant.threed.offsetx'],
1545
+ offsetY = prop['chart.variant.threed.offsety'],
1546
+ value = this.data[i][j];
1547
+
1548
+ pa2(
1549
+ co,
1550
+ [
1551
+ 'b',
1552
+ 'm', barX, barY,
1553
+ 'l', barX + offsetX, barY - offsetY,
1554
+ 'l', barX + barW + offsetX - (value < 0 ? offsetX : 0), barY - offsetY,
1555
+ 'l', barX + barW, barY,
1556
+ 'c',
1557
+ 's', co.strokeStyle,
1558
+ 'f', co.fillStyle,
1559
+ 'f','rgba(255,255,255,0.6)'//Fill again to lighten it
1560
+ ]
1561
+ );
1562
+
1563
+ if ( prop['chart.yaxispos'] !== 'right'
1564
+ && !(prop['chart.yaxispos'] === 'center' && value < 0)
1565
+ && value >= 0
1566
+ && !RG.isNull(value)
1567
+ ) {
1568
+
1569
+ pa2(
1570
+ co,
1571
+ [
1572
+ 'fs', prevFillStyle,
1573
+ 'b',
1574
+ 'm', barX + barW, barY,
1575
+ 'l', barX + barW + offsetX, barY - offsetY,
1576
+ 'l', barX + barW + offsetX, barY - offsetY + barH,
1577
+ 'l', barX + barW, barY + barH,
1578
+ 'c',
1579
+ 's', co.strokeStyle,
1580
+ 'f', prevFillStyle,
1581
+ 'f', 'rgba(0,0,0,0.25)'
1582
+ ]
1583
+ );
1584
+ }
1585
+
1586
+
1587
+
1588
+
1589
+
1590
+ co.beginPath();
1591
+ co.strokeStyle = prevStrokeStyle;
1592
+ co.fillStyle = prevFillStyle;
1593
+ }
1594
+
1595
+
1596
+
1597
+
1598
+
1599
+
1221
1600
  }
1222
1601
 
1223
1602
  startY += vmargin;
@@ -1228,15 +1607,49 @@
1228
1607
 
1229
1608
  co.stroke();
1230
1609
  co.fill();
1231
-
1232
-
1610
+
1611
+ // Under certain circumstances we can cover the shadow
1612
+ // overspill with a white rectangle
1613
+ if (prop['chart,yaxispos'] === 'right') {
1614
+ pa2(co, 'cr % % % %',
1615
+ ca.width - this.gutterRight + prop['chart.variant.threed.offsetx'],
1616
+ '0',
1617
+ this.gutterRight,
1618
+ ca.height
1619
+ );
1620
+ }
1621
+
1622
+
1623
+
1624
+
1625
+
1626
+
1627
+ // Draw the 3d axes AGAIN if the Y axis is on the right
1628
+ if ( prop['chart.yaxispos'] === 'right'
1629
+ && prop['chart.variant'] === '3d'
1630
+ ) {
1631
+ RG.draw3DYAxis(this);
1632
+ }
1233
1633
 
1234
1634
  /**
1235
1635
  * Now the bars are stroke()ed, turn off the shadow
1236
1636
  */
1237
- RG.NoShadow(this);
1637
+ RG.noShadow(this);
1638
+
1639
+
1640
+ //
1641
+ // Reverse the coords arrays as the bars are drawn from the borrom up now
1642
+ //
1643
+ this.coords = RG.arrayReverse(this.coords);
1644
+
1645
+ if (prop['chart.grouping'] === 'grouped') {
1646
+ for (var i=0; i<this.coords2.length; ++i) {
1647
+ this.coords2[i] = RG.arrayReverse(this.coords2[i]);
1648
+ }
1649
+ }
1238
1650
 
1239
- this.RedrawBars();
1651
+
1652
+ this.redrawBars();
1240
1653
  };
1241
1654
 
1242
1655
 
@@ -1254,9 +1667,9 @@
1254
1667
 
1255
1668
  var coords = this.coords;
1256
1669
 
1257
- var font = prop['chart.text.font'];
1258
- var size = prop['chart.text.size'];
1259
- var color = prop['chart.text.color'];
1670
+ var font = prop['chart.text.font'],
1671
+ size = prop['chart.text.size'],
1672
+ color = prop['chart.text.color'];
1260
1673
 
1261
1674
  RG.noShadow(this);
1262
1675
  co.strokeStyle = prop['chart.strokestyle'];
@@ -1304,15 +1717,16 @@
1304
1717
  halign = 'right';
1305
1718
  }
1306
1719
 
1307
- RG.Text2(this, {'font':font,
1308
- 'size':size,
1309
- 'x':x,
1310
- 'y':y,
1311
- 'text': text,
1312
- 'valign':'center',
1313
- 'halign': halign,
1314
- 'tag': 'labels.above'
1315
- });
1720
+ RG.text2(this, {
1721
+ 'font': font,
1722
+ 'size': size,
1723
+ 'x': x,
1724
+ 'y': y,
1725
+ 'text': text,
1726
+ 'valign': 'center',
1727
+ 'halign': halign,
1728
+ 'tag': 'labels.above'
1729
+ });
1316
1730
  }
1317
1731
  }
1318
1732
  };
@@ -1329,34 +1743,40 @@
1329
1743
  this.getShape =
1330
1744
  this.getBar = function (e)
1331
1745
  {
1332
- var mouseCoords = RG.getMouseXY(e);
1746
+ var mouseXY = RG.getMouseXY(e);
1333
1747
 
1334
1748
  /**
1335
1749
  * Loop through the bars determining if the mouse is over a bar
1336
1750
  */
1337
1751
  for (var i=0,len=this.coords.length; i<len; i++) {
1338
1752
 
1339
- var mouseX = mouseCoords[0]; // In relation to the canvas
1340
- var mouseY = mouseCoords[1]; // In relation to the canvas
1341
- var left = this.coords[i][0];
1342
- var top = this.coords[i][1];
1343
- var width = this.coords[i][2];
1344
- var height = this.coords[i][3];
1345
- var idx = i;
1346
-
1347
- if (mouseX >= left && mouseX <= (left + width) && mouseY >= top && mouseY <= (top + height) ) {
1753
+ var mouseX = mouseXY[0], // In relation to the canvas
1754
+ mouseY = mouseXY[1], // In relation to the canvas
1755
+ left = this.coords[i][0],
1756
+ top = this.coords[i][1],
1757
+ width = this.coords[i][2],
1758
+ height = this.coords[i][3],
1759
+ idx = i;
1760
+
1761
+
1762
+
1763
+ // Recreate the path/rectangle so that it can be tested
1764
+ // ** DO NOT STROKE OR FILL IT **
1765
+ pa(co,['b','r',left,top,width,height]);
1766
+
1767
+ if (co.isPointInPath(mouseX, mouseY)) {
1348
1768
 
1349
1769
  var tooltip = RG.parseTooltipText(prop['chart.tooltips'], i);
1350
-
1770
+
1351
1771
  return {
1352
- 0: this, 'object': this,
1353
- 1: left, 'x': left,
1354
- 2: top, 'y': top,
1355
- 3: width, 'width': width,
1356
- 4: height, 'height': height,
1357
- 5: idx, 'index': idx,
1358
- 'tooltip': tooltip
1359
- };
1772
+ 0: this, 'object': this,
1773
+ 1: left, 'x': left,
1774
+ 2: top, 'y': top,
1775
+ 3: width, 'width': width,
1776
+ 4: height, 'height': height,
1777
+ 5: idx, 'index': idx,
1778
+ 'tooltip': tooltip
1779
+ };
1360
1780
  }
1361
1781
  }
1362
1782
  };
@@ -1438,7 +1858,15 @@
1438
1858
  this.getObjectByXY = function (e)
1439
1859
  {
1440
1860
  var mouseXY = RG.getMouseXY(e);
1441
-
1861
+
1862
+ // Adjust the mouse Y coordinate for when the bar chart is
1863
+ // a 3D variant
1864
+ if (prop['chart.variant'] === '3d') {
1865
+ var adjustment = prop['chart.variant.threed.angle'] * mouseXY[0];
1866
+ mouseXY[1] -= adjustment;
1867
+ }
1868
+
1869
+
1442
1870
  if (
1443
1871
  mouseXY[0] > this.gutterLeft
1444
1872
  && mouseXY[0] < (ca.width - this.gutterRight)
@@ -1463,19 +1891,28 @@
1463
1891
  */
1464
1892
  this.positionTooltip = function (obj, x, y, tooltip, idx)
1465
1893
  {
1466
- var coordX = obj.coords[tooltip.__index__][0];
1467
- var coordY = obj.coords[tooltip.__index__][1];
1468
- var coordW = obj.coords[tooltip.__index__][2];
1469
- var coordH = obj.coords[tooltip.__index__][3];
1470
- var canvasXY = RG.getCanvasXY(obj.canvas);
1471
- var gutterLeft = obj.gutterLeft;
1472
- var gutterTop = obj.gutterTop;
1473
- var width = tooltip.offsetWidth;
1474
- var height = tooltip.offsetHeight;
1475
-
1894
+ var coordX = obj.coords[tooltip.__index__][0],
1895
+ coordY = obj.coords[tooltip.__index__][1],
1896
+ coordW = obj.coords[tooltip.__index__][2],
1897
+ coordH = obj.coords[tooltip.__index__][3],
1898
+ canvasXY = RG.getCanvasXY(obj.canvas),
1899
+ gutterLeft = obj.gutterLeft,
1900
+ gutterTop = obj.gutterTop,
1901
+ width = tooltip.offsetWidth,
1902
+ height = tooltip.offsetHeight,
1903
+ mouseXY = RG.getMouseXY(window.event);
1904
+
1905
+ // If the chart is a 3D version the tooltip Y position needs this
1906
+ // adjustment
1907
+ if (prop['chart.variant'] === '3d' && coordW) {
1908
+ var adjustment = (prop['chart.variant.threed.angle'] * ((coordX + coordW) / 2));
1909
+ }
1910
+
1911
+
1912
+
1476
1913
  // Set the top position
1477
1914
  tooltip.style.left = 0;
1478
- tooltip.style.top = canvasXY[1] + coordY + (coordH / 2) - height + 'px';
1915
+ tooltip.style.top = canvasXY[1] + coordY - height + 5 + (adjustment || 0) + 'px';
1479
1916
 
1480
1917
  // By default any overflow is hidden
1481
1918
  tooltip.style.overflow = '';
@@ -1705,36 +2142,36 @@
1705
2142
  */
1706
2143
  this.grow = function ()
1707
2144
  {
1708
- var obj = this;
1709
- var opt = arguments[0] || {};
1710
- var frames = opt.frames || 30;
1711
- var frame = 0;
1712
- var callback = arguments[1] || function () {};
2145
+ var obj = this,
2146
+ opt = arguments[0] || {},
2147
+ frames = opt.frames || 30,
2148
+ frame = 0,
2149
+ callback = arguments[1] || function () {};
1713
2150
 
1714
2151
 
1715
2152
  // Save the data
1716
- obj.original_data = RG.array_clone(obj.data);
2153
+ obj.original_data = RG.arrayClone(obj.data);
1717
2154
 
1718
2155
 
1719
2156
  // Stop the scale from changing by setting chart.ymax (if it's not already set)
1720
- if (obj.Get('chart.xmax') == 0) {
2157
+ if (prop['chart.xmax'] == 0) {
1721
2158
 
1722
2159
  var xmax = 0;
1723
2160
 
1724
2161
  for (var i=0; i<obj.data.length; ++i) {
1725
- if (RG.is_array(obj.data[i]) && obj.Get('chart.grouping') == 'stacked') {
1726
- xmax = Math.max(xmax, RG.array_sum(obj.data[i]));
1727
- } else if (RG.is_array(obj.data[i]) && obj.Get('chart.grouping') == 'grouped') {
1728
- xmax = ma.max(xmax, RG.array_max(obj.data[i]));
2162
+ if (RG.isArray(obj.data[i]) && prop['chart.grouping'] == 'stacked') {
2163
+ xmax = ma.max(xmax, RG.arraySum(obj.data[i]));
2164
+ } else if (RG.isArray(obj.data[i]) && prop['chart.grouping'] == 'grouped') {
2165
+ xmax = ma.max(xmax, RG.arrayMax(obj.data[i]));
1729
2166
  } else {
1730
- xmax = ma.max(xmax, RG.array_max(obj.data[i]));
2167
+ xmax = ma.max(xmax, ma.abs(RG.arrayMax(obj.data[i])));
1731
2168
  }
1732
2169
  }
1733
-
2170
+
1734
2171
  var scale2 = RG.getScale2(obj, {'max':xmax});
1735
2172
  obj.Set('chart.xmax', scale2.max);
1736
2173
  }
1737
-
2174
+
1738
2175
  function iterator ()
1739
2176
  {
1740
2177
  // Alter the Bar chart data depending on the frame
@@ -1743,12 +2180,12 @@
1743
2180
  // This stops the animation from being completely linear
1744
2181
  var easingFactor = RG.Effects.getEasingMultiplier(frames, frame);
1745
2182
 
1746
- if (typeof obj.data[j] === 'object') {
2183
+ if (typeof obj.data[j] === 'object' && obj.data[j]) {
1747
2184
  for (var k=0,len2=obj.data[j].length; k<len2; ++k) {
1748
- obj.data[j][k] = obj.original_data[j][k] * easingFactor;
2185
+ obj.data[j][k] = RG.isNull(obj.data[j][k]) ? null : obj.original_data[j][k] * easingFactor;
1749
2186
  }
1750
2187
  } else {
1751
- obj.data[j] = obj.original_data[j] * easingFactor;
2188
+ obj.data[j] = RG.isNull(obj.data[j]) ? null : obj.original_data[j] * easingFactor;
1752
2189
  }
1753
2190
  }
1754
2191
 
@@ -1771,7 +2208,96 @@
1771
2208
 
1772
2209
 
1773
2210
 
1774
- RG.att(ca);
2211
+
2212
+ /**
2213
+ * (new) Bar chart Wave effect. This is a rewrite that should be smoother
2214
+ * because it just uses a single loop and not setTimeout
2215
+ *
2216
+ * @param object OPTIONAL An object map of options. You specify 'frames' here to give the number of frames in the effect
2217
+ * @param function OPTIONAL A function that will be called when the effect is complete
2218
+ */
2219
+ this.wave = function ()
2220
+ {
2221
+ var obj = this,
2222
+ opt = arguments[0] || {};
2223
+ opt.frames = opt.frames || 60;
2224
+ opt.startFrames = [];
2225
+ opt.counters = [];
2226
+
2227
+ var framesperbar = opt.frames / 3,
2228
+ frame = -1,
2229
+ callback = arguments[1] || function () {},
2230
+ original = RG.arrayClone(obj.data);
2231
+
2232
+ for (var i=0,len=obj.data.length; i<len; i+=1) {
2233
+ opt.startFrames[i] = ((opt.frames / 2) / (obj.data.length - 1)) * i;
2234
+
2235
+ if (typeof obj.data[i] === 'object' && obj.data[i]) {
2236
+ opt.counters[i] = [];
2237
+ for (var j=0; j<obj.data[i].length; j++) {
2238
+ opt.counters[i][j] = 0;
2239
+ }
2240
+ } else {
2241
+ opt.counters[i] = 0;
2242
+ }
2243
+ }
2244
+
2245
+ /**
2246
+ * This stops the chart from jumping
2247
+ */
2248
+ obj.draw();
2249
+ obj.Set('xmax', obj.scale2.max);
2250
+ RG.clear(obj.canvas);
2251
+
2252
+ function iterator ()
2253
+ {
2254
+ ++frame;
2255
+
2256
+ for (var i=0,len=obj.data.length; i<len; i+=1) {
2257
+ if (frame > opt.startFrames[i]) {
2258
+ if (typeof obj.data[i] === 'number') {
2259
+
2260
+ obj.data[i] = ma.min(
2261
+ ma.abs(original[i]),
2262
+ ma.abs(original[i] * ( (opt.counters[i]++) / framesperbar))
2263
+ );
2264
+
2265
+ // Make the number negative if the original was
2266
+ if (original[i] < 0) {
2267
+ obj.data[i] *= -1;
2268
+ }
2269
+ } else if (!RG.isNull(obj.data[i])) {
2270
+ for (var j=0,len2=obj.data[i].length; j<len2; j+=1) {
2271
+
2272
+ obj.data[i][j] = ma.min(
2273
+ ma.abs(original[i][j]),
2274
+ ma.abs(original[i][j] * ( (opt.counters[i][j]++) / framesperbar))
2275
+ );
2276
+
2277
+ // Make the number negative if the original was
2278
+ if (original[i][j] < 0) {
2279
+ obj.data[i][j] *= -1;
2280
+ }
2281
+ }
2282
+ }
2283
+ } else {
2284
+ obj.data[i] = typeof obj.data[i] === 'object' && obj.data[i] ? RG.arrayPad([], obj.data[i].length, 0) : (RG.isNull(obj.data[i]) ? null : 0);
2285
+ }
2286
+ }
2287
+
2288
+
2289
+ if (frame >= opt.frames) {
2290
+ callback(obj);
2291
+ } else {
2292
+ RG.redrawCanvas(obj.canvas);
2293
+ RG.Effects.updateCanvas(iterator);
2294
+ }
2295
+ }
2296
+
2297
+ iterator();
2298
+
2299
+ return this;
2300
+ };
1775
2301
 
1776
2302
 
1777
2303