rgraph-rails 1.0.5 → 1.0.6

Sign up to get free protection for your applications and to get access to all the features.
Files changed (67) hide show
  1. checksums.yaml +8 -8
  2. data/.travis.yml +0 -1
  3. data/README.md +3 -3
  4. data/lib/rgraph-rails/version.rb +1 -1
  5. data/vendor/assets/javascripts/RGraph.bar.js +239 -3764
  6. data/vendor/assets/javascripts/RGraph.bipolar.js +115 -1986
  7. data/vendor/assets/javascripts/RGraph.common.annotate.js +35 -399
  8. data/vendor/assets/javascripts/RGraph.common.context.js +30 -600
  9. data/vendor/assets/javascripts/RGraph.common.core.js +403 -5187
  10. data/vendor/assets/javascripts/RGraph.common.csv.js +19 -275
  11. data/vendor/assets/javascripts/RGraph.common.deprecated.js +35 -454
  12. data/vendor/assets/javascripts/RGraph.common.dynamic.js +84 -1189
  13. data/vendor/assets/javascripts/RGraph.common.effects.js +90 -1548
  14. data/vendor/assets/javascripts/RGraph.common.key.js +54 -755
  15. data/vendor/assets/javascripts/RGraph.common.resizing.js +37 -567
  16. data/vendor/assets/javascripts/RGraph.common.sheets.js +29 -356
  17. data/vendor/assets/javascripts/RGraph.common.tooltips.js +32 -614
  18. data/vendor/assets/javascripts/RGraph.common.zoom.js +14 -223
  19. data/vendor/assets/javascripts/RGraph.cornergauge.js +71 -0
  20. data/vendor/assets/javascripts/RGraph.drawing.background.js +35 -620
  21. data/vendor/assets/javascripts/RGraph.drawing.circle.js +35 -576
  22. data/vendor/assets/javascripts/RGraph.drawing.image.js +52 -807
  23. data/vendor/assets/javascripts/RGraph.drawing.marker1.js +41 -717
  24. data/vendor/assets/javascripts/RGraph.drawing.marker2.js +37 -668
  25. data/vendor/assets/javascripts/RGraph.drawing.marker3.js +36 -563
  26. data/vendor/assets/javascripts/RGraph.drawing.poly.js +40 -608
  27. data/vendor/assets/javascripts/RGraph.drawing.rect.js +35 -597
  28. data/vendor/assets/javascripts/RGraph.drawing.text.js +34 -642
  29. data/vendor/assets/javascripts/RGraph.drawing.xaxis.js +50 -809
  30. data/vendor/assets/javascripts/RGraph.drawing.yaxis.js +51 -856
  31. data/vendor/assets/javascripts/RGraph.fuel.js +58 -964
  32. data/vendor/assets/javascripts/RGraph.funnel.js +55 -984
  33. data/vendor/assets/javascripts/RGraph.gantt.js +75 -1241
  34. data/vendor/assets/javascripts/RGraph.gauge.js +87 -1397
  35. data/vendor/assets/javascripts/RGraph.hbar.js +143 -2376
  36. data/vendor/assets/javascripts/RGraph.hprogress.js +80 -1397
  37. data/vendor/assets/javascripts/RGraph.line.js +241 -4162
  38. data/vendor/assets/javascripts/RGraph.meter.js +74 -1278
  39. metadata +3 -30
  40. data/vendor/assets/images/bg.png +0 -0
  41. data/vendor/assets/images/bullet.png +0 -0
  42. data/vendor/assets/images/facebook-large.png +0 -0
  43. data/vendor/assets/images/google-plus-large.png +0 -0
  44. data/vendor/assets/images/logo.png +0 -0
  45. data/vendor/assets/images/meter-image-sd-needle.png +0 -0
  46. data/vendor/assets/images/meter-image-sd.png +0 -0
  47. data/vendor/assets/images/meter-sketch-needle.png +0 -0
  48. data/vendor/assets/images/meter-sketch.png +0 -0
  49. data/vendor/assets/images/odometer-background.png +0 -0
  50. data/vendor/assets/images/rgraph.jpg +0 -0
  51. data/vendor/assets/images/title.png +0 -0
  52. data/vendor/assets/images/twitter-large.png +0 -0
  53. data/vendor/assets/javascripts/RGraph.modaldialog.js +0 -301
  54. data/vendor/assets/javascripts/RGraph.odo.js +0 -1265
  55. data/vendor/assets/javascripts/RGraph.pie.js +0 -2272
  56. data/vendor/assets/javascripts/RGraph.radar.js +0 -1847
  57. data/vendor/assets/javascripts/RGraph.rose.js +0 -1877
  58. data/vendor/assets/javascripts/RGraph.rscatter.js +0 -1425
  59. data/vendor/assets/javascripts/RGraph.scatter.js +0 -2970
  60. data/vendor/assets/javascripts/RGraph.semicircularprogress.js +0 -1015
  61. data/vendor/assets/javascripts/RGraph.thermometer.js +0 -1129
  62. data/vendor/assets/javascripts/RGraph.vprogress.js +0 -1452
  63. data/vendor/assets/javascripts/RGraph.waterfall.js +0 -1252
  64. data/vendor/assets/javascripts/financial-data.js +0 -1067
  65. data/vendor/assets/stylesheets/ModalDialog.css +0 -90
  66. data/vendor/assets/stylesheets/animations.css +0 -3347
  67. data/vendor/assets/stylesheets/website.css +0 -446
@@ -1,1129 +0,0 @@
1
- // version: 2016-06-04
2
- /**
3
- * o--------------------------------------------------------------------------------o
4
- * | This file is part of the RGraph package - you can learn more at: |
5
- * | |
6
- * | http://www.rgraph.net |
7
- * | |
8
- * | RGraph is dual licensed under the Open Source GPL (General Public License) |
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: |
12
- * | http://www.rgraph.net/license |
13
- * o--------------------------------------------------------------------------------o
14
- */
15
-
16
- RGraph = window.RGraph || {isRGraph: true};
17
-
18
-
19
-
20
-
21
- /**
22
- * The chart constructor. This function sets up the object. It takes the ID (the HTML attribute) of the canvas as the
23
- * first argument and the data as the second. If you need to change this, you can.
24
- *
25
- * NB: If tooltips are ever implemented they must go below the use event listeners!!
26
- *
27
- * @param string id The canvas tag ID
28
- * @param number min The minimum value
29
- * @param number max The maximum value
30
- * @param number value The value reported by the thermometer
31
- */
32
- RGraph.Thermometer = function (conf)
33
- {
34
- /**
35
- * Allow for object config style
36
- */
37
- if ( typeof conf === 'object'
38
- && typeof conf.id === 'string') {
39
-
40
- var parseConfObjectForOptions = true; // Set this so the config is parsed (at the end of the constructor)
41
-
42
- } else {
43
-
44
- var conf = {
45
- id: arguments[0],
46
- min: arguments[1],
47
- max: arguments[2],
48
- value: arguments[3]
49
- }
50
- }
51
-
52
-
53
-
54
-
55
- this.id = conf.id;
56
- this.canvas = document.getElementById(this.id);
57
- this.context = this.canvas.getContext ? this.canvas.getContext('2d') : null;
58
- this.canvas.__object__ = this;
59
- this.uid = RGraph.CreateUID();
60
- this.canvas.uid = this.canvas.uid ? this.canvas.uid : RGraph.CreateUID();
61
- this.colorsParsed = false;
62
- this.type = 'thermometer';
63
- this.isRGraph = true;
64
- this.min = RGraph.stringsToNumbers(conf.min);
65
- this.max = RGraph.stringsToNumbers(conf.max);
66
- this.value = RGraph.stringsToNumbers(conf.value);
67
- this.coords = [];
68
- this.graphArea = [];
69
- this.currentValue = null;
70
- this.bulbRadius = 0;
71
- this.bulbTopRadius = 0;
72
- this.bulbTopCenterX = 0
73
- this.bulbTopCenterY = 0;
74
- this.coordsText = [];
75
- this.original_colors = [];
76
- this.firstDraw = true; // After the first draw this will be false
77
-
78
-
79
-
80
-
81
- this.properties =
82
- {
83
- 'chart.strokestyle': 'black',
84
- 'chart.colors': ['Gradient(#c00:red:#f66:#fcc)'],
85
- 'chart.gutter.left': 15,
86
- 'chart.gutter.right': 15,
87
- 'chart.gutter.top': 15,
88
- 'chart.gutter.bottom': 15,
89
- 'chart.ticksize': 3,
90
- 'chart.text.color': 'black',
91
- 'chart.text.font': 'Segoe UI, Arial, Verdana, sans-serif',
92
- 'chart.text.size': 12,
93
- 'chart.text.accessible': true,
94
- 'chart.text.accessible.overflow': 'visible',
95
- 'chart.text.accessible.pointerevents': false,
96
- 'chart.units.pre': '',
97
- 'chart.units.post': '',
98
- 'chart.zoom.factor': 1.5,
99
- 'chart.zoom.fade.in': true,
100
- 'chart.zoom.fade.out': true,
101
- 'chart.zoom.hdir': 'right',
102
- 'chart.zoom.vdir': 'down',
103
- 'chart.zoom.frames': 25,
104
- 'chart.zoom.delay': 16.666,
105
- 'chart.zoom.shadow': true,
106
- 'chart.zoom.background': true,
107
- 'chart.title': '',
108
- 'chart.title.side': '',
109
- 'chart.title.side.bold': true,
110
- 'chart.title.side.font': null,
111
- 'chart.shadow': true,
112
- 'chart.shadow.offsetx': 0,
113
- 'chart.shadow.offsety': 0,
114
- 'chart.shadow.blur': 15,
115
- 'chart.shadow.color': 'gray',
116
- 'chart.resizable': false,
117
- 'chart.contextmenu': null,
118
- 'chart.adjustable': false,
119
- 'chart.value.label': true,
120
- 'chart.value.label.decimals': null,
121
- 'chart.value.label.thousand': ',',
122
- 'chart.value.label.point': '.',
123
- 'chart.labels.count': 5,
124
- 'chart.scale.visible': false,
125
- 'chart.scale.decimals': 0,
126
- 'chart.annotatable': false,
127
- 'chart.annotate.color': 'black',
128
- 'chart.scale.decimals': 0,
129
- 'chart.scale.point': '.',
130
- 'chart.scale.thousand': ',',
131
- 'chart.tooltips': null,
132
- 'chart.tooltips.highlight': true,
133
- 'chart.tooltips.effect': 'fade',
134
- 'chart.tooltips.event': 'onclick',
135
- 'chart.highlight.stroke': 'rgba(0,0,0,0)',
136
- 'chart.highlight.fill': 'rgba(255,255,255,0.7)',
137
- 'chart.clearto': 'rgba(0,0,0,0)'
138
- }
139
-
140
-
141
-
142
- /**
143
- * A simple check that the browser has canvas support
144
- */
145
- if (!this.canvas) {
146
- alert('[THERMOMETER] No canvas support');
147
- return;
148
- }
149
-
150
- /**
151
- * The thermometer can only have one data point so only this.$0 needs to be created
152
- */
153
- this.$0 = {}
154
-
155
-
156
- /**
157
- * Translate half a pixel for antialiasing purposes - but only if it hasn't beeen
158
- * done already
159
- */
160
- if (!this.canvas.__rgraph_aa_translated__) {
161
- this.context.translate(0.5,0.5);
162
-
163
- this.canvas.__rgraph_aa_translated__ = true;
164
- }
165
-
166
-
167
-
168
-
169
- // Short variable names
170
- var RG = RGraph,
171
- ca = this.canvas,
172
- co = ca.getContext('2d'),
173
- prop = this.properties,
174
- pa2 = RG.path2,
175
- win = window,
176
- doc = document,
177
- ma = Math
178
-
179
-
180
-
181
- /**
182
- * "Decorate" the object with the generic effects if the effects library has been included
183
- */
184
- if (RG.Effects && typeof RG.Effects.decorate === 'function') {
185
- RG.Effects.decorate(this);
186
- }
187
-
188
-
189
-
190
-
191
- /**
192
- * A setter.
193
- *
194
- * @param name string The name of the property to set
195
- * @param value mixed The value of the property
196
- */
197
- this.set =
198
- this.Set = function (name)
199
- {
200
- var value = typeof arguments[1] === 'undefined' ? null : arguments[1];
201
-
202
- /**
203
- * the number of arguments is only one and it's an
204
- * object - parse it for configuration data and return.
205
- */
206
- if (arguments.length === 1 && typeof name === 'object') {
207
- RG.parseObjectStyleConfig(this, name);
208
- return this;
209
- }
210
-
211
-
212
-
213
-
214
- /**
215
- * This should be done first - prepend the property name with "chart." if necessary
216
- */
217
- if (name.substr(0,6) != 'chart.') {
218
- name = 'chart.' + name;
219
- }
220
-
221
-
222
-
223
-
224
- // Convert uppercase letters to dot+lower case letter
225
- while(name.match(/([A-Z])/)) {
226
- name = name.replace(/([A-Z])/, '.' + RegExp.$1.toLowerCase());
227
- }
228
-
229
-
230
-
231
-
232
-
233
-
234
- /**
235
- * Change of name
236
- */
237
- if (name == 'chart.ylabels.count') {
238
- name = 'chart.labels.count';
239
- }
240
- prop[name.toLowerCase()] = value;
241
-
242
- return this;
243
- };
244
-
245
-
246
-
247
-
248
- /**
249
- * A getter.
250
- *
251
- * @param name string The name of the property to get
252
- */
253
- this.get =
254
- this.Get = function (name)
255
- {
256
- /**
257
- * This should be done first - prepend the property name with "chart." if necessary
258
- */
259
- if (name.substr(0,6) != 'chart.') {
260
- name = 'chart.' + name;
261
- }
262
-
263
- // Convert uppercase letters to dot+lower case letter
264
- name = name.replace(/([A-Z])/g, function (str)
265
- {
266
- return '.' + String(RegExp.$1).toLowerCase()
267
- });
268
-
269
- return prop[name];
270
- };
271
-
272
-
273
-
274
-
275
- /**
276
- * Draws the thermometer
277
- */
278
- this.draw =
279
- this.Draw = function ()
280
- {
281
- // Fire the custom RGraph onbeforedraw event (which should be fired before the chart is drawn)
282
- RG.fireCustomEvent(this, 'onbeforedraw');
283
-
284
- /**
285
- * Parse the colors. This allows for simple gradient syntax
286
- */
287
- if (!this.colorsParsed) {
288
- this.parseColors();
289
-
290
- // Don't want to do this again
291
- this.colorsParsed = true;
292
- }
293
-
294
- /**
295
- * Set the current value
296
- */
297
- this.currentValue = this.value;
298
-
299
-
300
-
301
- /**
302
- * Stop this growing uncontrollably
303
- */
304
- this.coordsText = [];
305
-
306
-
307
-
308
-
309
-
310
- // This is new in May 2011 and facilitates indiviual gutter settings,
311
- // eg chart.gutter.left
312
- this.gutterLeft = prop['chart.gutter.left'];
313
- this.gutterRight = prop['chart.gutter.right'];
314
- this.gutterTop = prop['chart.gutter.top'];
315
- this.gutterBottom = prop['chart.gutter.bottom'];
316
-
317
-
318
- // Get the scale
319
- this.scale2 = RG.getScale2(
320
- this, {
321
- 'max':this.max,
322
- 'min':this.min,
323
- 'strict':true,
324
- 'scale.thousand':prop['chart.scale.thousand'],
325
- 'scale.point':prop['chart.scale.point'],
326
- 'scale.decimals':prop['chart.scale.decimals'],
327
- 'ylabels.count':prop['chart.labels.count'],
328
- 'scale.round':prop['chart.scale.round'],
329
- 'units.pre': prop['chart.units.pre'],
330
- 'units.post': prop['chart.units.post']
331
- }
332
- );
333
-
334
-
335
- // Draw the background
336
- this.drawBackground();
337
-
338
- // Draw the bar that represents the value
339
- this.drawBar();
340
-
341
-
342
-
343
-
344
- // Draw the tickmarks
345
- this.drawTickMarks();
346
-
347
-
348
-
349
- /**
350
- * Draw the label
351
- */
352
- this.DrawLabels();
353
-
354
-
355
-
356
- /**
357
- * Draw the title
358
- */
359
- if (prop['chart.title']) {
360
- this.DrawTitle();
361
- }
362
-
363
- /**
364
- * Draw the side title
365
- */
366
- if (prop['chart.title.side']) {
367
- this.DrawSideTitle();
368
- }
369
-
370
- /**
371
- * This function enables resizing
372
- */
373
- if (prop['chart.resizable']) {
374
- RG.AllowResizing(this);
375
- }
376
-
377
-
378
-
379
-
380
- /**
381
- * Setup the context menu if required
382
- */
383
- if (prop['chart.contextmenu']) {
384
- RG.ShowContext(this);
385
- }
386
-
387
-
388
-
389
-
390
- /**
391
- * This installs the event listeners
392
- */
393
- RG.InstallEventListeners(this);
394
-
395
-
396
- /**
397
- * Fire the onfirstdraw event
398
- */
399
- if (this.firstDraw) {
400
- RG.fireCustomEvent(this, 'onfirstdraw');
401
- this.firstDraw = false;
402
- this.firstDrawFunc();
403
- }
404
-
405
-
406
-
407
- /**
408
- * Fire the custom RGraph ondraw event (which should be fired when you have drawn the chart)
409
- */
410
- RG.FireCustomEvent(this, 'ondraw');
411
-
412
- return this;
413
- };
414
-
415
-
416
-
417
-
418
-
419
- /**
420
- * Draws the thermometer itself
421
- */
422
- this.drawBackground =
423
- this.DrawBackground = function ()
424
- {
425
- var bulbRadius = (ca.width - this.gutterLeft - this.gutterRight) / 2;
426
-
427
- // This is the radius/x/y of the top "semi-circle"
428
- this.bulbTopRadius = (ca.width - this.gutterLeft - this.gutterRight - 24)/ 2
429
- this.bulbTopCenterX = this.gutterLeft + bulbRadius;
430
- this.bulbTopCenterY = this.gutterTop + bulbRadius;
431
-
432
- //This is the radius/x/y of the bottom bulb
433
- this.bulbBottomRadius = bulbRadius;
434
- this.bulbBottomCenterX = this.gutterLeft + bulbRadius;
435
- this.bulbBottomCenterY = ca.height - this.gutterBottom - bulbRadius;
436
-
437
- // Save the bulbRadius as an object variable
438
- this.bulbRadius = bulbRadius;
439
-
440
- // Draw the black background that becomes the border
441
- co.beginPath();
442
- co.fillStyle = prop['chart.strokestyle'];
443
-
444
- if (prop['chart.shadow']) {
445
- RG.setShadow(
446
- this,
447
- prop['chart.shadow.color'],
448
- prop['chart.shadow.offsetx'],
449
- prop['chart.shadow.offsety'],
450
- prop['chart.shadow.blur']
451
- );
452
- }
453
-
454
- co.fillRect(this.gutterLeft + 12,this.gutterTop + bulbRadius,ca.width - this.gutterLeft - this.gutterRight - 24, ca.height - this.gutterTop - this.gutterBottom - bulbRadius - bulbRadius);
455
-
456
- // Bottom bulb
457
- co.arc(this.bulbBottomCenterX, this.bulbBottomCenterY, bulbRadius, 0, RG.TWOPI, 0);
458
-
459
- // Top bulb (which is actually a semi-circle)
460
- co.arc(this.bulbTopCenterX,this.bulbTopCenterY,this.bulbTopRadius,0,RG.TWOPI,0);
461
- co.fill();
462
-
463
- // Save the radius of the top semi circle
464
-
465
-
466
- RG.NoShadow(this);
467
-
468
- // Draw the white inner content background that creates the border
469
- co.beginPath();
470
- co.fillStyle = 'white';
471
- co.fillRect(this.gutterLeft + 12 + 1,this.gutterTop + bulbRadius,ca.width - this.gutterLeft - this.gutterRight - 24 - 2,ca.height - this.gutterTop - this.gutterBottom - bulbRadius - bulbRadius);
472
- co.arc(this.gutterLeft + bulbRadius, ca.height - this.gutterBottom - bulbRadius, bulbRadius - 1, 0, RG.TWOPI, 0);
473
- co.arc(this.gutterLeft + bulbRadius,this.gutterTop + bulbRadius,((ca.width - this.gutterLeft - this.gutterRight - 24)/ 2) - 1,0,RG.TWOPI,0);
474
- co.fill();
475
-
476
- // Draw the bottom content of the thermometer
477
- co.beginPath();
478
- co.fillStyle = prop['chart.colors'][0];
479
- co.arc(this.gutterLeft + bulbRadius, ca.height - this.gutterBottom - bulbRadius, bulbRadius - 1, 0, RG.TWOPI, 0);
480
- co.rect(this.gutterLeft + 12 + 1, ca.height - this.gutterBottom - bulbRadius - bulbRadius,ca.width - this.gutterLeft - this.gutterRight - 24 - 2, bulbRadius);
481
- co.fill();
482
-
483
-
484
- // Save the X/Y/width/height
485
- this.graphArea[0] = this.gutterLeft + 12 + 1;
486
- this.graphArea[1] = this.gutterTop + bulbRadius;
487
- this.graphArea[2] = ca.width - this.gutterLeft - this.gutterRight - 24 - 2;
488
- this.graphArea[3] = (ca.height - this.gutterBottom - bulbRadius - bulbRadius) - (this.graphArea[1]);
489
- };
490
-
491
-
492
-
493
-
494
- /**
495
- * This draws the bar that indicates the value of the thermometer
496
- */
497
- this.drawBar =
498
- this.DrawBar = function ()
499
- {
500
- var barHeight = ((this.value - this.min) / (this.max - this.min)) * this.graphArea[3];
501
-
502
- // Draw the actual bar that indicates the value
503
- co.beginPath();
504
- co.fillStyle = prop['chart.colors'][0];
505
-
506
- // This solves an issue with ExCanvas showing a whiite cutout in the chart
507
- if (RGraph.ISOLD) {
508
- co.arc(this.bulbBottomCenterX, this.bulbBottomCenterY, this.bulbBottomRadius - 1, 0, RG.TWOPI, false)
509
- }
510
-
511
-
512
- co.rect(this.graphArea[0],
513
- this.graphArea[1] + this.graphArea[3] - barHeight,
514
- this.graphArea[2],
515
- barHeight + 2);
516
- co.fill();
517
-
518
- this.coords[0] = [this.graphArea[0],this.graphArea[1] + this.graphArea[3] - barHeight,this.graphArea[2],barHeight];
519
- };
520
-
521
-
522
-
523
-
524
- /**
525
- * Draws the tickmarks of the thermometer
526
- */
527
- this.drawTickMarks =
528
- this.DrawTickMarks = function ()
529
- {
530
- co.strokeStyle = prop['chart.strokestyle']
531
- var ticksize = prop['chart.ticksize'];
532
-
533
- // Left hand side tickmarks
534
- co.beginPath();
535
- for (var i=this.graphArea[1]; i<=(this.graphArea[1] + this.graphArea[3]); i += (this.graphArea[3] / 10)) {
536
- co.moveTo(this.gutterLeft + 12, Math.round(i));
537
- co.lineTo(this.gutterLeft + 12 + ticksize, Math.round(i));
538
- }
539
- co.stroke();
540
-
541
- // Right hand side tickmarks
542
- co.beginPath();
543
- for (var i=this.graphArea[1]; i<=(this.graphArea[1] + this.graphArea[3]); i += (this.graphArea[3] / 10)) {
544
- co.moveTo(ca.width - (this.gutterRight + 12), Math.round(i));
545
- co.lineTo(ca.width - (this.gutterRight + 12 + ticksize), Math.round(i));
546
- }
547
- co.stroke();
548
- };
549
-
550
-
551
-
552
-
553
- /**
554
- * Draws the labels of the thermometer. Now (4th August 2011) draws
555
- * the scale too
556
- */
557
- this.drawLabels =
558
- this.DrawLabels = function ()
559
- {
560
- /**
561
- * This draws draws the label that sits at the top of the chart
562
- */
563
- if (prop['chart.value.label']) {
564
- co.fillStyle = prop['chart.text.color'];
565
-
566
- // Weird...
567
- var text = prop['chart.scale.visible'] ? RG.number_format(this,
568
- this.value.toFixed(typeof prop['chart.value.label.decimals'] == 'number' ? prop['chart.value.label.decimals'] : prop['chart.scale.decimals'])
569
- )
570
- :
571
- RG.number_format(this,
572
- this.value.toFixed(typeof prop['chart.value.label.decimals'] == 'number' ? prop['chart.value.label.decimals'] : prop['chart.scale.decimals']),
573
- prop['chart.units.pre'],
574
- prop['chart.units.post']
575
- );
576
-
577
- RG.Text2(this, {'font': prop['chart.text.font'],
578
- 'size': prop['chart.text.size'],
579
- 'x':this.gutterLeft + this.bulbRadius,
580
- 'y': this.coords[0][1] + 7,
581
- 'text': text,
582
- 'valign':'top',
583
- 'halign':'center',
584
- 'bounding':true,
585
- 'boundingFill':'white',
586
- 'tag': 'value.label'
587
- });
588
- }
589
-
590
-
591
- /**
592
- * Draw the scale if requested
593
- */
594
- if (prop['chart.scale.visible']) {
595
- this.DrawScale();
596
- }
597
- };
598
-
599
-
600
-
601
-
602
- /**
603
- * Draws the title
604
- */
605
- this.drawTitle =
606
- this.DrawTitle = function ()
607
- {
608
- co.fillStyle = prop['chart.text.color'];
609
- RG.Text2(this, {'font': prop['chart.text.font'],
610
- 'size': prop['chart.text.size'] + 2,
611
- 'x':this.gutterLeft + ((ca.width - this.gutterLeft - this.gutterRight) / 2),
612
- 'y': this.gutterTop,
613
- 'text': String(prop['chart.title']),
614
- 'valign':'center',
615
- 'halign':'center',
616
- 'bold':true,
617
- 'tag': 'title'
618
- });
619
- };
620
-
621
-
622
-
623
-
624
- /**
625
- * Draws the title
626
- */
627
- this.drawSideTitle =
628
- this.DrawSideTitle = function ()
629
- {
630
- var font = prop['chart.title.side.font'] ? prop['chart.title.side.font'] : prop['chart.text.font'];
631
- var size = prop['chart.title.side.size'] ? prop['chart.title.side.size'] : prop['chart.text.size'] + 2;
632
-
633
- co.fillStyle = prop['chart.text.color'];
634
- RG.Text2(this, {'font': font,
635
- 'size': size + 2,
636
- 'x':this.gutterLeft - 3,
637
- 'y': ((ca.height - this.gutterTop - this.gutterBottom) / 2) + this.gutterTop,
638
- 'text': String(prop['chart.title.side']),
639
- 'valign':'center',
640
- 'halign':'center',
641
- 'angle':270,
642
- 'bold':prop['chart.title.side.bold'],
643
- 'tag': 'title.side'
644
- });
645
- };
646
-
647
-
648
-
649
-
650
- /**
651
- * Draw the scale if requested
652
- */
653
- this.drawScale =
654
- this.DrawScale = function ()
655
- {
656
- var numLabels = prop['chart.labels.count']; // The -1 is so that the number of labels tallies with what is displayed
657
- var step = (this.max - this.min) / numLabels;
658
-
659
- co.fillStyle = prop['chart.text.color'];
660
-
661
- var font = prop['chart.text.font'];
662
- var size = prop['chart.text.size'];
663
- var units_pre = prop['chart.units.pre'];
664
- var units_post = prop['chart.units.post'];
665
- var decimals = prop['chart.scale.decimals'];
666
-
667
- for (var i=1; i<=numLabels; ++i) {
668
-
669
- var x = ca.width - this.gutterRight;
670
- var y = ca.height - this.gutterBottom - (2 * this.bulbRadius) - ((this.graphArea[3] / numLabels) * i);
671
- var text = RG.number_format(this, String((this.min + (i * step)).toFixed(decimals)), units_pre, units_post);
672
-
673
- RG.Text2(this, {'font':font,
674
- 'size':size,
675
- 'x':x-6,
676
- 'y':y,
677
- 'text':text,
678
- 'valign':'center',
679
- 'tag': 'scale'
680
- });
681
- }
682
-
683
- // Draw zero
684
- RG.Text2(this, {'font':font,
685
- 'size':size,
686
- 'x':x-6,
687
- 'y':ca.height - this.gutterBottom - (2 * this.bulbRadius),
688
- 'text':RG.number_format(this, (this.min).toFixed(decimals),units_pre,units_post),
689
- 'valign':'center',
690
- 'tag': 'scale'
691
- });
692
- };
693
-
694
-
695
-
696
-
697
- /**
698
- * Returns the focused/clicked bar
699
- *
700
- * @param event e The event object
701
- */
702
- this.getShape =
703
- this.getBar = function (e)
704
- {
705
- for (var i=0; i<this.coords.length; i++) {
706
-
707
- var mouseCoords = RGraph.getMouseXY(e);
708
- var mouseX = mouseCoords[0];
709
- var mouseY = mouseCoords[1];
710
-
711
- var left = this.coords[i][0];
712
- var top = this.coords[i][1];
713
- var width = this.coords[i][2];
714
- var height = this.coords[i][3];
715
-
716
- if ( (mouseX >= left && mouseX <= (left + width) && mouseY >= top && mouseY <= (top + height + this.bulbBottomRadius)) // The bulbBottomRadius is added as the rect and the bulb don't fully cover the red bit
717
- || RG.getHypLength(this.bulbBottomCenterX, this.bulbBottomCenterY, mouseX, mouseY) <= this.bulbBottomRadius) {
718
-
719
-
720
- var tooltip = RG.parseTooltipText ? RG.parseTooltipText(prop['chart.tooltips'], i) : '';
721
-
722
-
723
- return {0: this, 'object': this,
724
- 1: left, 'x': left,
725
- 2: top, 'y': top,
726
- 3: width, 'width': width,
727
- 4: height, 'height': height,
728
- 5: i, 'index': i,
729
- 'tooltip': tooltip
730
- };
731
- }
732
- }
733
-
734
- return null;
735
- };
736
-
737
-
738
-
739
-
740
- /**
741
- * This function returns the value that the mouse is positioned t, regardless of
742
- * the actual indicated value.
743
- *
744
- * @param object e The event object (or it can also be an two element array containing the X/Y coords)
745
- */
746
- this.getValue = function (arg)
747
- {
748
- if (arg.length == 2) {
749
- var mouseX = arg[0];
750
- var mouseY = arg[1];
751
- } else {
752
- var mouseCoords = RGraph.getMouseXY(arg);
753
- var mouseX = mouseCoords[0];
754
- var mouseY = mouseCoords[1];
755
- }
756
-
757
-
758
-
759
- var value = this.graphArea[3] - (mouseY - this.graphArea[1]);
760
- value = (value / this.graphArea[3]) * (this.max - this.min);
761
- value = value + this.min;
762
-
763
- value = Math.max(value, this.min);
764
- value = Math.min(value, this.max);
765
-
766
- return value;
767
- };
768
-
769
-
770
-
771
-
772
- /**
773
- * Each object type has its own Highlight() function which highlights the appropriate shape
774
- *
775
- * @param object shape The shape to highlight
776
- */
777
- this.highlight =
778
- this.Highlight = function (shape)
779
- {
780
- if (prop['chart.tooltips.highlight']) {
781
-
782
- if (typeof prop['chart.highlight.style'] === 'function') {
783
- (prop['chart.highlight.style'])(shape);
784
- return;
785
- }
786
-
787
- pa2(co, 'b r % % % % a % % % % % false s % f %',
788
- shape['x'],
789
- shape['y'],
790
- shape['width'],
791
- shape['height'] + this.bulbBottomRadius,
792
- this.bulbBottomCenterX,
793
- this.bulbBottomCenterY,
794
- this.bulbBottomRadius - 1,
795
- 0,
796
- RG.TWOPI,
797
- prop['chart.highlight.stroke'],
798
- prop['chart.highlight.fill']
799
- );
800
- }
801
- };
802
-
803
-
804
-
805
-
806
- /**
807
- * The getObjectByXY() worker method. Don't call this - call:
808
- *
809
- * RGraph.ObjectRegistry.getObjectByXY(e)
810
- *
811
- * @param object e The event object
812
- */
813
- this.getObjectByXY = function (e)
814
- {
815
- var mouseXY = RGraph.getMouseXY(e);
816
-
817
- if (
818
- mouseXY[0] > this.gutterLeft
819
- && mouseXY[0] < (ca.width - this.gutterRight)
820
- && mouseXY[1] >= this.gutterTop
821
- && mouseXY[1] <= (ca.height - this.gutterBottom)
822
- ) {
823
-
824
- return this;
825
- }
826
- };
827
-
828
-
829
-
830
-
831
- /**
832
- * This method handles the adjusting calculation for when the mouse is moved
833
- *
834
- * @param object e The event object
835
- */
836
- this.adjusting_mousemove =
837
- this.Adjusting_mousemove = function (e)
838
- {
839
- /**
840
- * Handle adjusting for the Thermometer
841
- */
842
- if (prop['chart.adjustable'] && RG.Registry.Get('chart.adjusting') && RG.Registry.Get('chart.adjusting').uid == this.uid) {
843
-
844
- var mouseXY = RGraph.getMouseXY(e);
845
- var value = this.getValue(e);
846
-
847
- if (typeof(value) == 'number') {
848
-
849
- // Fire the onadjust event
850
- RG.FireCustomEvent(this, 'onadjust');
851
-
852
- this.value = Number(value.toFixed(prop['chart.scale.decimals']));
853
-
854
- RG.redrawCanvas(ca);
855
- }
856
- }
857
- };
858
-
859
-
860
-
861
-
862
- /**
863
- * This function positions a tooltip when it is displayed
864
- *
865
- * @param obj object The chart object
866
- * @param int x The X coordinate specified for the tooltip
867
- * @param int y The Y coordinate specified for the tooltip
868
- * @param objec tooltip The tooltips DIV element
869
- */
870
- this.positionTooltip = function (obj, x, y, tooltip, idx)
871
- {
872
- var coordX = obj.coords[tooltip.__index__][0];
873
- var coordY = obj.coords[tooltip.__index__][1];
874
- var coordW = obj.coords[tooltip.__index__][2];
875
- var coordH = obj.coords[tooltip.__index__][3];
876
- var canvasXY = RGraph.getCanvasXY(ca);
877
- var mouseXY = RG.getMouseXY(window.event);
878
- var gutterLeft = obj.gutterLeft;
879
- var gutterTop = obj.gutterTop;
880
- var width = tooltip.offsetWidth;
881
- var height = tooltip.offsetHeight;
882
-
883
- // Set the top position
884
- tooltip.style.left = 0;
885
- tooltip.style.top = window.event.pageY - height - 5 + 'px';
886
-
887
- // By default any overflow is hidden
888
- tooltip.style.overflow = '';
889
-
890
- // Reposition the tooltip if at the edges:
891
-
892
- // LEFT edge
893
- if (canvasXY[0] + mouseXY[0] - (width / 2) < 0) {
894
- tooltip.style.left = canvasXY[0] + mouseXY[0] - (width * 0.1) + 'px';
895
-
896
- // RIGHT edge
897
- } else if (canvasXY[0] + mouseXY[0] + (width / 2) > doc.body.offsetWidth) {
898
- tooltip.style.left = canvasXY[0] + mouseXY[0] - (width * 0.9) + 'px';
899
-
900
- // Default positioning - CENTERED
901
- } else {
902
- tooltip.style.left = canvasXY[0] + mouseXY[0] - (width / 2) + 'px';
903
- }
904
- };
905
-
906
-
907
-
908
-
909
- /**
910
- * Returns the appropriate Y coord for a value
911
- *
912
- * @param number value The value to return the coord for
913
- */
914
- this.getYCoord = function (value)
915
- {
916
- if (value > this.max || value < this.min) {
917
- return null;
918
- }
919
-
920
- var y = (this.graphArea[1] + this.graphArea[3]) - (((value - this.min) / (this.max - this.min)) * this.graphArea[3]);
921
-
922
- return y;
923
- };
924
-
925
-
926
-
927
-
928
- /**
929
- * This returns true/false as to whether the cursor is over the chart area.
930
- * The cursor does not necessarily have to be over the bar itself.
931
- */
932
- this.overChartArea = function (e)
933
- {
934
- var mouseXY = RG.getMouseXY(e);
935
- var mouseX = mouseXY[0];
936
- var mouseY = mouseXY[1];
937
-
938
- // Is the mouse in the "graphArea"?
939
- // ( with a little extra height added)
940
- if ( mouseX >= this.graphArea[0]
941
- && mouseX <= (this.graphArea[0] + this.graphArea[2])
942
- && mouseY >= this.graphArea[1]
943
- && mouseY <= (this.graphArea[1] + this.graphArea[3] + this.bulbRadius)
944
- ) {
945
-
946
- return true;
947
- }
948
-
949
- // Is the mouse over the bottom bulb?
950
- if (RG.getHypLength(this.bulbBottomCenterX, this.bulbBottomCenterY, mouseX, mouseY) <= this.bulbRadius) {
951
- return true;
952
- }
953
-
954
- // Is the mouse over the semi-circle at the top?
955
- if (RG.getHypLength(this.bulbTopCenterX, this.bulbTopCenterY, mouseX, mouseY) <= this.bulbTopRadius) {
956
- return true;
957
- }
958
-
959
- return false;
960
- };
961
-
962
-
963
-
964
-
965
- /**
966
- * This allows for easy specification of gradients
967
- */
968
- this.parseColors = function ()
969
- {
970
- // Save the original colors so that they can be restored when the canvas is reset
971
- if (this.original_colors.length === 0) {
972
- this.original_colors['chart.colors'] = RG.array_clone(prop['chart.colors']);
973
- }
974
-
975
-
976
-
977
-
978
-
979
- var colors = prop['chart.colors'];
980
-
981
- for (var i=0; i<colors.length; ++i) {
982
- colors[i] = this.parseSingleColorForGradient(colors[i]);
983
- }
984
- };
985
-
986
-
987
-
988
-
989
- /**
990
- * Use this function to reset the object to the post-constructor state. Eg reset colors if
991
- * need be etc
992
- */
993
- this.reset = function ()
994
- {
995
- };
996
-
997
-
998
-
999
-
1000
- /**
1001
- * This parses a single color value
1002
- */
1003
- this.parseSingleColorForGradient = function (color)
1004
- {
1005
- if (!color) {
1006
- return color;
1007
- }
1008
-
1009
- if (typeof color === 'string' && color.match(/^gradient\((.*)\)$/i)) {
1010
-
1011
- var parts = RegExp.$1.split(':');
1012
-
1013
- // Create the gradient
1014
- var grad = co.createLinearGradient(prop['chart.gutter.left'], 0, ca.width - prop['chart.gutter.right'],0);
1015
-
1016
- var diff = 1 / (parts.length - 1);
1017
-
1018
- grad.addColorStop(0, RG.trim(parts[0]));
1019
-
1020
- for (var j=1; j<parts.length; ++j) {
1021
- grad.addColorStop(j * diff, RG.trim(parts[j]));
1022
- }
1023
- }
1024
-
1025
- return grad ? grad : color;
1026
- };
1027
-
1028
-
1029
-
1030
-
1031
- /**
1032
- * Using a function to add events makes it easier to facilitate method chaining
1033
- *
1034
- * @param string type The type of even to add
1035
- * @param function func
1036
- */
1037
- this.on = function (type, func)
1038
- {
1039
- if (type.substr(0,2) !== 'on') {
1040
- type = 'on' + type;
1041
- }
1042
-
1043
- this[type] = func;
1044
-
1045
- return this;
1046
- };
1047
-
1048
-
1049
-
1050
-
1051
- /**
1052
- * This function runs once only
1053
- * (put at the end of the file (before any effects))
1054
- */
1055
- this.firstDrawFunc = function ()
1056
- {
1057
- };
1058
-
1059
-
1060
-
1061
-
1062
- /**
1063
- * Gauge Grow
1064
- *
1065
- * This effect gradually increases the represented value
1066
- *
1067
- * @param object obj The chart object
1068
- * @param Not used - pass null
1069
- * @param function An optional callback function
1070
- */
1071
- this.grow = function ()
1072
- {
1073
- var obj = this;
1074
- var callback = arguments[1] || function () {};
1075
- var opt = arguments[0] || {};
1076
- var frames = opt.frames ? opt.frames : 30;
1077
- var origValue = Number(obj.currentValue);
1078
- var newValue = obj.value;
1079
- newValue = ma.min(newValue, this.max);
1080
- newValue = ma.max(newValue, this.min);
1081
- var diff = newValue - origValue;
1082
- var step = (diff / frames);
1083
- var frame = 0;
1084
-
1085
-
1086
- function iterate ()
1087
- {
1088
- // Set the new value
1089
- obj.value = (step * frame) + origValue;
1090
-
1091
- RGraph.clear(obj.canvas);
1092
- RGraph.redrawCanvas(obj.canvas);
1093
-
1094
- if (frame < frames) {
1095
- frame++;
1096
- RGraph.Effects.updateCanvas(iterate);
1097
- } else {
1098
- callback(obj);
1099
- }
1100
- }
1101
-
1102
- iterate();
1103
-
1104
- return this;
1105
- };
1106
-
1107
-
1108
-
1109
- RG.att(ca);
1110
-
1111
-
1112
-
1113
-
1114
- /**
1115
- * Now, because canvases can support multiple charts, canvases must always be registered
1116
- */
1117
- RG.Register(this);
1118
-
1119
-
1120
-
1121
-
1122
- /**
1123
- * This is the 'end' of the constructor so if the first argument
1124
- * contains configuration data - handle that.
1125
- */
1126
- if (parseConfObjectForOptions) {
1127
- RG.parseObjectStyleConfig(this, conf.options);
1128
- }
1129
- };