rgraph-rails 4.62 → 4.64

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 (67) hide show
  1. checksums.yaml +5 -5
  2. data/README.md +3 -4
  3. data/lib/rgraph-rails/version.rb +1 -1
  4. data/vendor/assets/javascripts/RGraph.bar.js +240 -3742
  5. data/vendor/assets/javascripts/RGraph.bipolar.js +165 -2005
  6. data/vendor/assets/javascripts/RGraph.common.annotate.js +35 -395
  7. data/vendor/assets/javascripts/RGraph.common.context.js +30 -595
  8. data/vendor/assets/javascripts/RGraph.common.core.js +418 -5359
  9. data/vendor/assets/javascripts/RGraph.common.csv.js +20 -276
  10. data/vendor/assets/javascripts/RGraph.common.deprecated.js +35 -450
  11. data/vendor/assets/javascripts/RGraph.common.dynamic.js +88 -1395
  12. data/vendor/assets/javascripts/RGraph.common.effects.js +90 -1545
  13. data/vendor/assets/javascripts/RGraph.common.key.js +52 -753
  14. data/vendor/assets/javascripts/RGraph.common.resizing.js +37 -563
  15. data/vendor/assets/javascripts/RGraph.common.sheets.js +29 -352
  16. data/vendor/assets/javascripts/RGraph.common.tooltips.js +32 -450
  17. data/vendor/assets/javascripts/RGraph.common.zoom.js +14 -219
  18. data/vendor/assets/javascripts/RGraph.cornergauge.js +71 -0
  19. data/vendor/assets/javascripts/RGraph.drawing.background.js +34 -570
  20. data/vendor/assets/javascripts/RGraph.drawing.circle.js +33 -544
  21. data/vendor/assets/javascripts/RGraph.drawing.image.js +51 -755
  22. data/vendor/assets/javascripts/RGraph.drawing.marker1.js +37 -645
  23. data/vendor/assets/javascripts/RGraph.drawing.marker2.js +36 -633
  24. data/vendor/assets/javascripts/RGraph.drawing.marker3.js +35 -514
  25. data/vendor/assets/javascripts/RGraph.drawing.poly.js +37 -559
  26. data/vendor/assets/javascripts/RGraph.drawing.rect.js +33 -548
  27. data/vendor/assets/javascripts/RGraph.drawing.text.js +36 -664
  28. data/vendor/assets/javascripts/RGraph.drawing.xaxis.js +50 -812
  29. data/vendor/assets/javascripts/RGraph.drawing.yaxis.js +51 -856
  30. data/vendor/assets/javascripts/RGraph.fuel.js +58 -964
  31. data/vendor/assets/javascripts/RGraph.funnel.js +55 -984
  32. data/vendor/assets/javascripts/RGraph.gantt.js +77 -1354
  33. data/vendor/assets/javascripts/RGraph.gauge.js +85 -1421
  34. data/vendor/assets/javascripts/RGraph.hbar.js +162 -2788
  35. data/vendor/assets/javascripts/RGraph.hprogress.js +80 -1401
  36. data/vendor/assets/javascripts/RGraph.line.js +249 -4248
  37. data/vendor/assets/javascripts/RGraph.meter.js +74 -1280
  38. data/vendor/assets/javascripts/RGraph.modaldialog.js +19 -301
  39. data/vendor/assets/javascripts/RGraph.odo.js +71 -1264
  40. data/vendor/assets/javascripts/RGraph.pie.js +137 -2288
  41. data/vendor/assets/javascripts/RGraph.radar.js +110 -1847
  42. data/vendor/assets/javascripts/RGraph.rose.js +108 -1977
  43. data/vendor/assets/javascripts/RGraph.rscatter.js +80 -1432
  44. data/vendor/assets/javascripts/RGraph.scatter.js +172 -3163
  45. data/vendor/assets/javascripts/RGraph.semicircularprogress.js +60 -1120
  46. data/vendor/assets/javascripts/RGraph.svg.bar.js +66 -1735
  47. data/vendor/assets/javascripts/RGraph.svg.common.ajax.js +21 -246
  48. data/vendor/assets/javascripts/RGraph.svg.common.core.js +255 -3937
  49. data/vendor/assets/javascripts/RGraph.svg.common.csv.js +20 -276
  50. data/vendor/assets/javascripts/RGraph.svg.common.fx.js +68 -1303
  51. data/vendor/assets/javascripts/RGraph.svg.common.key.js +19 -205
  52. data/vendor/assets/javascripts/RGraph.svg.common.sheets.js +29 -352
  53. data/vendor/assets/javascripts/RGraph.svg.common.tooltips.js +22 -273
  54. data/vendor/assets/javascripts/RGraph.svg.funnel.js +32 -0
  55. data/vendor/assets/javascripts/RGraph.svg.hbar.js +59 -1400
  56. data/vendor/assets/javascripts/RGraph.svg.line.js +70 -1580
  57. data/vendor/assets/javascripts/RGraph.svg.pie.js +55 -1131
  58. data/vendor/assets/javascripts/RGraph.svg.radar.js +57 -1502
  59. data/vendor/assets/javascripts/RGraph.svg.rose.js +66 -1817
  60. data/vendor/assets/javascripts/RGraph.svg.scatter.js +58 -1261
  61. data/vendor/assets/javascripts/RGraph.svg.semicircularprogress.js +28 -865
  62. data/vendor/assets/javascripts/RGraph.svg.waterfall.js +45 -1252
  63. data/vendor/assets/javascripts/RGraph.thermometer.js +63 -1136
  64. data/vendor/assets/javascripts/RGraph.vprogress.js +83 -1470
  65. data/vendor/assets/javascripts/RGraph.waterfall.js +83 -1347
  66. metadata +5 -4
  67. data/vendor/assets/javascripts/financial-data.js +0 -1067
@@ -1,756 +1,52 @@
1
- // version: 2017-05-08
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 licensed under the Open Source MIT license. That means that it's |
9
- * | totally free to use! |
10
- * o--------------------------------------------------------------------------------o
11
- */
12
-
13
- /**
14
- * Having this here means that the RGraph libraries can be included in any order, instead of you having
15
- * to include the common core library first.
16
- */
17
1
 
18
- // Define the RGraph global variable
19
- RGraph = window.RGraph || {isRGraph: true};
20
- RGraph.Drawing = RGraph.Drawing || {};
21
-
22
- /**
23
- * The constructor. This function sets up the object. It takes the ID (the HTML attribute) of the canvas as the
24
- * first argument and the data as the second. If you need to change this, you can.
25
- *
26
- * @param string id The canvas tag ID
27
- * @param number x The X position of the label
28
- * @param number y The Y position of the label
29
- * @param number text The text used
30
- */
31
- RGraph.Drawing.Image = function (conf)
32
- {
33
- /**
34
- * Allow for object config style
35
- */
36
- if ( typeof conf === 'object'
37
- && typeof conf.x === 'number'
38
- && typeof conf.y === 'number'
39
- && typeof conf.src === 'string'
40
- && typeof conf.id === 'string') {
41
-
42
- var id = conf.id,
43
- canvas = document.getElementById(id),
44
- x = conf.x,
45
- y = conf.y,
46
- src = conf.src,
47
- parseConfObjectForOptions = true; // Set this so the config is parsed (at the end of the constructor)
48
-
49
- } else {
50
-
51
- var id = conf,
52
- canvas = document.getElementById(id),
53
- x = arguments[1],
54
- y = arguments[2],
55
- src = arguments[3];
56
- }
57
-
58
-
59
-
60
-
61
- // id, x, y
62
- this.id = id;
63
- this.canvas = document.getElementById(this.id);
64
- this.context = this.canvas.getContext('2d');
65
- this.colorsParsed = false;
66
- this.canvas.__object__ = this;
67
- this.alignmentProcessed = false;
68
- this.original_colors = [];
69
- this.firstDraw = true; // After the first draw this will be false
70
-
71
-
72
- /**
73
- * Store the properties
74
- */
75
- this.x = x;
76
- this.y = y;
77
- this.src = src;
78
- this.img = new Image();
79
- this.img.src = this.src;
80
-
81
-
82
- /**
83
- * This defines the type of this shape
84
- */
85
- this.type = 'drawing.image';
86
-
87
-
88
- /**
89
- * This facilitates easy object identification, and should always be true
90
- */
91
- this.isRGraph = true;
92
-
93
-
94
- /**
95
- * This adds a uid to the object that you can use for identification purposes
96
- */
97
- this.uid = RGraph.createUID();
98
-
99
-
100
- /**
101
- * This adds a UID to the canvas for identification purposes
102
- */
103
- this.canvas.uid = this.canvas.uid ? this.canvas.uid : RGraph.CreateUID();
104
-
105
-
106
-
107
-
108
- /**
109
- * Some example background properties
110
- */
111
- this.properties =
112
- {
113
- 'chart.src': null,
114
- 'chart.width': null,
115
- 'chart.height': null,
116
- 'chart.halign': 'left',
117
- 'chart.valign': 'top',
118
- 'chart.events.mousemove': null,
119
- 'chart.events.click': null,
120
- 'chart.shadow': false,
121
- 'chart.shadow.color': 'gray',
122
- 'chart.shadow.offsetx': 3,
123
- 'chart.shadow.offsety': 3,
124
- 'chart.shadow.blur': 5,
125
- 'chart.tooltips': null,
126
- 'chart.tooltips.highlight': true,
127
- 'chart.tooltips.css.class': 'RGraph_tooltip',
128
- 'chart.tooltips.event': 'onclick',
129
- 'chart.highlight.stroke': 'rgba(0,0,0,0)',
130
- 'chart.highlight.fill': 'rgba(255,255,255,0.7)',
131
- 'chart.alpha': 1,
132
- 'chart.border': false,
133
- 'chart.border.color': 'black',
134
- 'chart.border.linewidth': 1,
135
- 'chart.border.radius': 0,
136
- 'chart.background.color': 'rgba(0,0,0,0)',
137
- 'chart.clearto': 'rgba(0,0,0,0)'
138
- }
139
-
140
- /**
141
- * A simple check that the browser has canvas support
142
- */
143
- if (!this.canvas) {
144
- alert('[DRAWING.IMAGE] No canvas support');
145
- return;
146
- }
147
-
148
- /**
149
- * This can be used to store the coordinates of shapes on the graph
150
- */
151
- this.coords = [];
152
-
153
-
154
- /**
155
- * Create the dollar object so that functions can be added to them
156
- */
157
- this.$0 = {};
158
-
159
-
160
- /*
161
- * Translate half a pixel for antialiasing purposes - but only if it hasn't beeen
162
- * done already
163
- */
164
- if (!this.canvas.__rgraph_aa_translated__) {
165
- this.context.translate(0.5,0.5);
166
- this.canvas.__rgraph_aa_translated__ = true;
167
- }
168
-
169
-
170
-
171
-
172
- // Short variable names
173
- var RG = RGraph,
174
- ca = this.canvas,
175
- co = ca.getContext('2d'),
176
- prop = this.properties,
177
- pa2 = RG.path2,
178
- win = window,
179
- doc = document,
180
- ma = Math
181
-
182
-
183
-
184
- /**
185
- * "Decorate" the object with the generic effects if the effects library has been included
186
- */
187
- if (RG.Effects && typeof RG.Effects.decorate === 'function') {
188
- RG.Effects.decorate(this);
189
- }
190
-
191
-
192
-
193
-
194
- /**
195
- * A setter method for setting graph properties. It can be used like this: obj.Set('chart.strokestyle', '#666');
196
- *
197
- * @param name string The name of the property to set OR it can be a map
198
- * of name/value settings like what you set in the constructor
199
- */
200
- this.set =
201
- this.Set = function (name)
202
- {
203
- var value = typeof arguments[1] === 'undefined' ? null : arguments[1];
204
-
205
- /**
206
- * the number of arguments is only one and it's an
207
- * object - parse it for configuration data and return.
208
- */
209
- if (arguments.length === 1 && typeof name === 'object') {
210
- RG.parseObjectStyleConfig(this, name);
211
- return this;
212
- }
213
-
214
-
215
-
216
-
217
-
218
- /**
219
- * This should be done first - prepend the propertyy name with "chart." if necessary
220
- */
221
- if (name.substr(0,6) != 'chart.') {
222
- name = 'chart.' + name;
223
- }
224
-
225
-
226
-
227
-
228
- // Convert uppercase letters to dot+lower case letter
229
- while(name.match(/([A-Z])/)) {
230
- name = name.replace(/([A-Z])/, '.' + RegExp.$1.toLowerCase());
231
- }
232
-
233
-
234
-
235
-
236
-
237
-
238
- prop[name] = value;
239
-
240
- return this;
241
- };
242
-
243
-
244
-
245
-
246
- /**
247
- * A getter method for retrieving graph properties. It can be used like this: obj.Get('chart.strokestyle');
248
- *
249
- * @param name string The name of the property to get
250
- */
251
- this.get =
252
- this.Get = function (name)
253
- {
254
- /**
255
- * This should be done first - prepend the property name with "chart." if necessary
256
- */
257
- if (name.substr(0,6) != 'chart.') {
258
- name = 'chart.' + name;
259
- }
260
-
261
- // Convert uppercase letters to dot+lower case letter
262
- while(name.match(/([A-Z])/)) {
263
- name = name.replace(/([A-Z])/, '.' + RegExp.$1.toLowerCase());
264
- }
265
-
266
- return prop[name.toLowerCase()];
267
- };
268
-
269
-
270
-
271
-
272
- /**
273
- * Draws the circle
274
- */
275
- this.draw =
276
- this.Draw = function ()
277
- {
278
- /**
279
- * Fire the onbeforedraw event
280
- */
281
- RG.fireCustomEvent(this, 'onbeforedraw');
282
-
283
-
284
- /**
285
- * Parse the colors. This allows for simple gradient syntax
286
- */
287
- var obj = this;
288
- this.img.onload = function ()
289
- {
290
- if (!obj.colorsParsed) {
291
-
292
- obj.parseColors();
293
-
294
- // Don't want to do this again
295
- obj.colorsParsed = true;
296
- }
297
-
298
- obj.width = this.width;
299
- obj.height = this.height;
300
-
301
-
302
-
303
-
304
-
305
-
306
-
307
- if (!this.alignmentProcessed) {
308
-
309
- var customWidthHeight = (typeof obj.properties['chart.width'] == 'number' && typeof obj.properties['chart.width'] == 'number');
310
-
311
- // Horizontal alignment
312
- if (obj.properties['chart.halign'] === 'center') {
313
- obj.x -= customWidthHeight ? (obj.properties['chart.width'] / 2) : (this.width / 2);
314
- } else if (obj.properties['chart.halign'] == 'right') {
315
- obj.x -= customWidthHeight ? obj.properties['chart.width'] : this.width;
316
- }
317
-
318
- // Vertical alignment
319
- if (obj.properties['chart.valign'] === 'center') {
320
- obj.y -= customWidthHeight ? (obj.properties['chart.height'] / 2) : (this.height / 2);
321
- } else if (obj.properties['chart.valign'] == 'bottom') {
322
- obj.y -= customWidthHeight ? obj.properties['chart.height'] : this.height;
323
- }
324
-
325
- // Don't do this again
326
- this.alignmentProcessed = true;
327
- }
328
- }
329
-
330
-
331
-
332
-
333
-
334
-
335
-
336
-
337
- // The onload event doesn't always fire - so call it manually as well
338
- if (this.img.complete || this.img.readyState === 4) {
339
- this.img.onload();
340
- }
341
-
342
-
343
- /**
344
- * Draw the image here
345
- */
346
-
347
- if (prop['chart.shadow']) {
348
- RG.setShadow(this, prop['chart.shadow.color'], prop['chart.shadow.offsetx'], prop['chart.shadow.offsety'], prop['chart.shadow.blur']);
349
- }
350
-
351
- var oldAlpha = co.globalAlpha;
352
- co.globalAlpha = prop['chart.alpha'];
353
-
354
-
355
-
356
-
357
-
358
- /**
359
- * Draw a border around the image
360
- */
361
- if (prop['chart.border']) {
362
-
363
- co.strokeStyle = prop['chart.border.color'];
364
- co.lineWidth = prop['chart.border.linewidth'];
365
-
366
- var borderRadius = 0;
367
-
368
- // Work out the borderRadius only if the image has been loaded
369
- if (this.width || this.height) {
370
- borderRadius = ma.min(this.width / 2, this.height / 2)
371
- }
372
-
373
- if ((prop['chart.width'] / 2) > borderRadius && (prop['chart.height'] / 2) > borderRadius) {
374
- borderRadius = ma.min((prop['chart.width'] / 2), (prop['chart.height'] / 2))
375
- }
376
-
377
- if (prop['chart.border.radius'] < borderRadius) {
378
- borderRadius = prop['chart.border.radius'];
379
- }
380
-
381
-
382
-
383
-
384
- co.beginPath();
385
- this.roundedRect(
386
- ma.round(this.x) - ma.round(co.lineWidth / 2),
387
- ma.round(this.y) - ma.round(co.lineWidth / 2),
388
- (prop['chart.width'] || this.img.width) + co.lineWidth,
389
- (prop['chart.height'] || this.img.height) + co.lineWidth,
390
- borderRadius
391
- );
392
- }
393
-
394
-
395
-
396
- if (borderRadius) {
397
- co.save();
398
-
399
- // Draw the rect that casts the shadow
400
-
401
- // Draw the background color
402
- this.drawBackgroundColor(borderRadius);
403
-
404
-
405
-
406
- // Clip the canvas
407
- co.beginPath();
408
- this.roundedRect(
409
- ma.round(this.x) - ma.round(co.lineWidth / 2),
410
- ma.round(this.y) - ma.round(co.lineWidth / 2),
411
- (prop['chart.width'] || this.img.width) + co.lineWidth,
412
- (prop['chart.height'] || this.img.height) + co.lineWidth,
413
- borderRadius
414
- );
415
- co.clip();
416
-
417
- } else {
418
-
419
- // Draw the background color
420
- this.drawBackgroundColor(0);
421
- }
422
-
423
- RG.noShadow(this);
424
-
425
-
426
- if (typeof prop['chart.height'] === 'number' || typeof prop['chart.width'] === 'number') {
427
- co.drawImage(
428
- this.img,
429
- ma.round(this.x),
430
- ma.round(this.y),
431
- prop['chart.width'] || this.width,
432
- prop['chart.height'] || this.height
433
- );
434
- } else {
435
- co.drawImage(
436
- this.img,
437
- ma.round(this.x),
438
- ma.round(this.y)
439
- );
440
- }
441
-
442
-
443
-
444
-
445
- // If borderRadius is enabled restore the canvas to it's pre-clipped state
446
- if (borderRadius) {
447
- co.restore();
448
- }
449
-
450
-
451
-
452
- // If the border is enabled need a stroke so that the border is drawn
453
- if (prop['chart.border']) {
454
- RG.noShadow(this);
455
- co.stroke();
456
- }
457
-
458
-
459
-
460
-
461
-
462
- co.globalAlpha = oldAlpha;
463
-
464
- //var obj = this;
465
-
466
- this.img.onload = function ()
467
- {
468
- RG.redrawCanvas(ca);
469
-
470
- obj.coords[0] = [
471
- ma.round(obj.x),
472
- ma.round(obj.y),
473
- typeof prop['chart.width'] === 'number' ? prop['chart.width'] : this.width, typeof prop['chart.height'] == 'number' ? prop['chart.height'] : this.height
474
- ];
475
- }
476
-
477
- RG.noShadow(this);
478
-
479
-
480
- /**
481
- * This installs the event listeners
482
- */
483
- RG.installEventListeners(this);
484
-
485
-
486
- /**
487
- * Fire the onfirstdraw event
488
- */
489
- if (this.firstDraw) {
490
- RG.fireCustomEvent(this, 'onfirstdraw');
491
- this.firstDraw = false;
492
- this.firstDrawFunc();
493
- }
494
-
495
-
496
-
497
-
498
- /**
499
- * Fire the ondraw event
500
- */
501
- RG.fireCustomEvent(this, 'ondraw');
502
-
503
- return this;
504
- };
505
-
506
-
507
-
508
- /**
509
- * Used in chaining. Runs a function there and then - not waiting for
510
- * the events to fire (eg the onbeforedraw event)
511
- *
512
- * @param function func The function to execute
513
- */
514
- this.exec = function (func)
515
- {
516
- func(this);
517
-
518
- return this;
519
- };
520
-
521
-
522
-
523
-
524
- /**
525
- * The getObjectByXY() worker method
526
- */
527
- this.getObjectByXY = function (e)
528
- {
529
- var mouseXY = RG.getMouseXY(e);
530
-
531
- if (this.getShape(e)) {
532
- return this;
533
- }
534
- };
535
-
536
-
537
-
538
-
539
- /**
540
- * Not used by the class during creating the shape, but is used by event handlers
541
- * to get the coordinates (if any) of the selected bar
542
- *
543
- * @param object e The event object
544
- * @param object OPTIONAL You can pass in the bar object instead of the
545
- * function using "this"
546
- */
547
- this.getShape = function (e)
548
- {
549
- var mouseXY = RG.getMouseXY(e),
550
- mouseX = mouseXY[0],
551
- mouseY = mouseXY[1];
552
-
553
- if ( this.coords
554
- && this.coords[0]
555
- && mouseXY[0] >= this.coords[0][0]
556
- && mouseXY[0] <= (this.coords[0][0] + this.coords[0][2])
557
- && mouseXY[1] >= this.coords[0][1]
558
- && mouseXY[1] <= (this.coords[0][1] + this.coords[0][3])) {
559
-
560
- return {
561
- 0: this, 1: this.coords[0][0], 2: this.coords[0][1], 3: this.coords[0][2], 4: this.coords[0][3], 5: 0,
562
- 'object': this, 'x': this.coords[0][0], 'y': this.coords[0][1], 'width': this.coords[0][2], 'height': this.coords[0][3], 'index': 0, 'tooltip': prop['chart.tooltips'] ? prop['chart.tooltips'][0] : null
563
- };
564
- }
565
-
566
- return null;
567
- };
568
-
569
-
570
-
571
-
572
- /**
573
- * Each object type has its own Highlight() function which highlights the appropriate shape
574
- *
575
- * @param object shape The shape to highlight
576
- */
577
- this.highlight =
578
- this.Highlight = function (shape)
579
- {
580
- if (prop['chart.tooltips.highlight']) {
581
- if (typeof prop['chart.highlight.style'] === 'function') {
582
- (prop['chart.highlight.style'])(shape);
583
- } else {
584
- pa2(co, ['b','r',this.coords[0][0],this.coords[0][1],this.coords[0][2],this.coords[0][3], 'f',prop['chart.highlight.fill'], 's', prop['chart.highlight.stroke']]);
585
- }
586
- }
587
- };
588
-
589
-
590
-
591
-
592
- /**
593
- * This allows for easy specification of gradients
594
- */
595
- this.parseColors = function ()
596
- {
597
- // Save the original colors so that they can be restored when the canvas is reset
598
- if (this.original_colors.length === 0) {
599
- this.original_colors['chart.highlight.stroke'] = RG.array_clone(prop['chart.highlight.stroke']);
600
- this.original_colors['chart.highlight.fill'] = RG.array_clone(prop['chart.highlight.fill']);
601
- }
602
-
603
-
604
-
605
-
606
- /**
607
- * Parse various properties for colors
608
- */
609
- prop['chart.highlight.stroke'] = this.parseSingleColorForGradient(prop['chart.highlight.stroke']);
610
- prop['chart.highlight.fill'] = this.parseSingleColorForGradient(prop['chart.highlight.fill']);
611
- };
612
-
613
-
614
-
615
-
616
- /**
617
- * Use this function to reset the object to the post-constructor state. Eg reset colors if
618
- * need be etc
619
- */
620
- this.reset = function ()
621
- {
622
- };
623
-
624
-
625
-
626
-
627
- /**
628
- * This parses a single color value
629
- */
630
- this.parseSingleColorForGradient = function (color)
631
- {
632
- if (!color) {
633
- return color;
634
- }
635
-
636
-
637
- if (typeof color === 'string' && color.match(/^gradient\((.*)\)$/i)) {
638
-
639
- var parts = RegExp.$1.split(':'),
640
- grad = co.createLinearGradient(this.x, this.y, this.x + this.img.width, this.y),
641
- diff = 1 / (parts.length - 1);
642
-
643
- grad.addColorStop(0, RG.trim(parts[0]));
644
-
645
- for (var j=1; j<parts.length; ++j) {
646
- grad.addColorStop(j * diff, RG.trim(parts[j]));
647
- }
648
- }
649
-
650
- return grad ? grad : color;
651
- };
652
-
653
-
654
-
655
-
656
- /**
657
- * Using a function to add events makes it easier to facilitate method chaining
658
- *
659
- * @param string type The type of even to add
660
- * @param function func
661
- */
662
- this.on = function (type, func)
663
- {
664
- if (type.substr(0,2) !== 'on') {
665
- type = 'on' + type;
666
- }
667
-
668
- if (typeof this[type] !== 'function') {
669
- this[type] = func;
670
- } else {
671
- RG.addCustomEventListener(this, type, func);
672
- }
673
-
674
- return this;
675
- };
676
-
677
-
678
-
679
-
680
- /**
681
- * This function runs once only
682
- * (put at the end of the file (before any effects))
683
- */
684
- this.firstDrawFunc = function ()
685
- {
686
- };
687
-
688
-
689
-
690
-
691
- /**
692
- * This draws a rectangle for the border of the image with optional rounded corners
693
- */
694
- this.roundedRect = function (x, y, width, height, radius)
695
- {
696
- // Save the existing state of the canvas so that it can be restored later
697
- co.save();
698
-
699
- // Translate to the given X/Y coordinates
700
- co.translate(x, y);
701
-
702
- // Move to the center of the top horizontal line
703
- co.moveTo(width / 2,0);
704
-
705
- // Draw the rounded corners. The connecting lines in between them are drawn automatically
706
- co.arcTo(width,0,width,height, ma.min(height / 2, radius));
707
- co.arcTo(width, height, 0, height, ma.min(width / 2, radius));
708
- co.arcTo(0, height, 0, 0, ma.min(height / 2, radius));
709
- co.arcTo(0, 0, radius, 0, ma.min(width / 2, radius));
710
-
711
- // Draw a line back to the start coordinates
712
- co.lineTo(width / 2,0);
713
-
714
- // Restore the state of the canvas to as it was before the save()
715
- co.restore();
716
- };
717
-
718
-
719
-
720
-
721
- /**
722
- *
723
- */
724
- this.drawBackgroundColor = function (borderRadius)
725
- {
726
- co.beginPath();
727
- co.fillStyle = prop['chart.background.color'];
728
- this.roundedRect(
729
- ma.round(this.x) - ma.round(co.lineWidth / 2),
730
- ma.round(this.y) - ma.round(co.lineWidth / 2),
731
- (prop['chart.width'] || this.img.width) + co.lineWidth,
732
- (prop['chart.height'] || this.img.height) + co.lineWidth,
733
- borderRadius
734
- );
735
- co.fill();
736
- };
737
-
738
-
739
-
740
-
741
- /**
742
- * Objects are now always registered so that the chart is redrawn if need be.
743
- */
744
- RG.register(this);
745
-
746
-
747
-
748
-
749
- /**
750
- * This is the 'end' of the constructor so if the first argument
751
- * contains configuration data - handle that.
752
- */
753
- if (parseConfObjectForOptions) {
754
- RG.parseObjectStyleConfig(this, conf.options);
755
- }
756
- };
2
+ RGraph=window.RGraph||{isRGraph:true};RGraph.Drawing=RGraph.Drawing||{};RGraph.Drawing.Image=function(conf)
3
+ {if(typeof conf==='object'&&typeof conf.x==='number'&&typeof conf.y==='number'&&typeof conf.src==='string'&&typeof conf.id==='string'){var id=conf.id,canvas=document.getElementById(id),x=conf.x,y=conf.y,src=conf.src,parseConfObjectForOptions=true;}else{var id=conf,canvas=document.getElementById(id),x=arguments[1],y=arguments[2],src=arguments[3];}
4
+ this.id=id;this.canvas=document.getElementById(this.id);this.context=this.canvas.getContext('2d');this.colorsParsed=false;this.canvas.__object__=this;this.alignmentProcessed=false;this.original_colors=[];this.firstDraw=true;this.x=x;this.y=y;this.src=src;this.img=new Image();this.img.src=this.src;this.type='drawing.image';this.isRGraph=true;this.uid=RGraph.createUID();this.canvas.uid=this.canvas.uid?this.canvas.uid:RGraph.CreateUID();this.properties={'chart.src':null,'chart.width':null,'chart.height':null,'chart.halign':'left','chart.valign':'top','chart.events.mousemove':null,'chart.events.click':null,'chart.shadow':false,'chart.shadow.color':'gray','chart.shadow.offsetx':3,'chart.shadow.offsety':3,'chart.shadow.blur':5,'chart.tooltips':null,'chart.tooltips.highlight':true,'chart.tooltips.css.class':'RGraph_tooltip','chart.tooltips.event':'onclick','chart.highlight.stroke':'rgba(0,0,0,0)','chart.highlight.fill':'rgba(255,255,255,0.7)','chart.alpha':1,'chart.border':false,'chart.border.color':'black','chart.border.linewidth':1,'chart.border.radius':0,'chart.background.color':'rgba(0,0,0,0)','chart.clearto':'rgba(0,0,0,0)'}
5
+ if(!this.canvas){alert('[DRAWING.IMAGE] No canvas support');return;}
6
+ this.coords=[];this.$0={};if(!this.canvas.__rgraph_aa_translated__){this.context.translate(0.5,0.5);this.canvas.__rgraph_aa_translated__=true;}
7
+ var RG=RGraph,ca=this.canvas,co=ca.getContext('2d'),prop=this.properties,pa2=RG.path2,win=window,doc=document,ma=Math
8
+ if(RG.Effects&&typeof RG.Effects.decorate==='function'){RG.Effects.decorate(this);}
9
+ this.set=this.Set=function(name)
10
+ {var value=typeof arguments[1]==='undefined'?null:arguments[1];if(arguments.length===1&&typeof name==='object'){RG.parseObjectStyleConfig(this,name);return this;}
11
+ if(name.substr(0,6)!='chart.'){name='chart.'+name;}
12
+ while(name.match(/([A-Z])/)){name=name.replace(/([A-Z])/,'.'+RegExp.$1.toLowerCase());}
13
+ prop[name]=value;return this;};this.get=this.Get=function(name)
14
+ {if(name.substr(0,6)!='chart.'){name='chart.'+name;}
15
+ while(name.match(/([A-Z])/)){name=name.replace(/([A-Z])/,'.'+RegExp.$1.toLowerCase());}
16
+ return prop[name.toLowerCase()];};this.draw=this.Draw=function()
17
+ {RG.fireCustomEvent(this,'onbeforedraw');var obj=this;this.img.onload=function()
18
+ {if(!obj.colorsParsed){obj.parseColors();obj.colorsParsed=true;}
19
+ obj.width=this.width;obj.height=this.height;if(!this.alignmentProcessed){var customWidthHeight=(typeof obj.properties['chart.width']=='number'&&typeof obj.properties['chart.width']=='number');if(obj.properties['chart.halign']==='center'){obj.x-=customWidthHeight?(obj.properties['chart.width']/2):(this.width/2);}else if(obj.properties['chart.halign']=='right'){obj.x-=customWidthHeight?obj.properties['chart.width']:this.width;}
20
+ if(obj.properties['chart.valign']==='center'){obj.y-=customWidthHeight?(obj.properties['chart.height']/2):(this.height/2);}else if(obj.properties['chart.valign']=='bottom'){obj.y-=customWidthHeight?obj.properties['chart.height']:this.height;}
21
+ this.alignmentProcessed=true;}}
22
+ if(this.img.complete||this.img.readyState===4){this.img.onload();}
23
+ if(prop['chart.shadow']){RG.setShadow(this,prop['chart.shadow.color'],prop['chart.shadow.offsetx'],prop['chart.shadow.offsety'],prop['chart.shadow.blur']);}
24
+ var oldAlpha=co.globalAlpha;co.globalAlpha=prop['chart.alpha'];if(prop['chart.border']){co.strokeStyle=prop['chart.border.color'];co.lineWidth=prop['chart.border.linewidth'];var borderRadius=0;if(this.width||this.height){borderRadius=ma.min(this.width/2,this.height/2)}
25
+ if((prop['chart.width']/2)>borderRadius&&(prop['chart.height']/2)>borderRadius){borderRadius=ma.min((prop['chart.width']/2),(prop['chart.height']/2))}
26
+ if(prop['chart.border.radius']<borderRadius){borderRadius=prop['chart.border.radius'];}
27
+ co.beginPath();this.roundedRect(ma.round(this.x)-ma.round(co.lineWidth/2),ma.round(this.y)-ma.round(co.lineWidth/2),(prop['chart.width']||this.img.width)+co.lineWidth,(prop['chart.height']||this.img.height)+co.lineWidth,borderRadius);}
28
+ if(borderRadius){co.save();this.drawBackgroundColor(borderRadius);co.beginPath();this.roundedRect(ma.round(this.x)-ma.round(co.lineWidth/2),ma.round(this.y)-ma.round(co.lineWidth/2),(prop['chart.width']||this.img.width)+co.lineWidth,(prop['chart.height']||this.img.height)+co.lineWidth,borderRadius);co.clip();}else{this.drawBackgroundColor(0);}
29
+ RG.noShadow(this);if(typeof prop['chart.height']==='number'||typeof prop['chart.width']==='number'){co.drawImage(this.img,ma.round(this.x),ma.round(this.y),prop['chart.width']||this.width,prop['chart.height']||this.height);}else{co.drawImage(this.img,ma.round(this.x),ma.round(this.y));}
30
+ if(borderRadius){co.restore();}
31
+ if(prop['chart.border']){RG.noShadow(this);co.stroke();}
32
+ co.globalAlpha=oldAlpha;this.img.onload=function()
33
+ {RG.redrawCanvas(ca);obj.coords[0]=[ma.round(obj.x),ma.round(obj.y),typeof prop['chart.width']==='number'?prop['chart.width']:this.width,typeof prop['chart.height']=='number'?prop['chart.height']:this.height];}
34
+ RG.noShadow(this);RG.installEventListeners(this);if(this.firstDraw){this.firstDraw=false;RG.fireCustomEvent(this,'onfirstdraw');this.firstDrawFunc();}
35
+ RG.fireCustomEvent(this,'ondraw');return this;};this.exec=function(func)
36
+ {func(this);return this;};this.getObjectByXY=function(e)
37
+ {var mouseXY=RG.getMouseXY(e);if(this.getShape(e)){return this;}};this.getShape=function(e)
38
+ {var mouseXY=RG.getMouseXY(e),mouseX=mouseXY[0],mouseY=mouseXY[1];if(this.coords&&this.coords[0]&&mouseXY[0]>=this.coords[0][0]&&mouseXY[0]<=(this.coords[0][0]+this.coords[0][2])&&mouseXY[1]>=this.coords[0][1]&&mouseXY[1]<=(this.coords[0][1]+this.coords[0][3])){return{0:this,1:this.coords[0][0],2:this.coords[0][1],3:this.coords[0][2],4:this.coords[0][3],5:0,'object':this,'x':this.coords[0][0],'y':this.coords[0][1],'width':this.coords[0][2],'height':this.coords[0][3],'index':0,'tooltip':prop['chart.tooltips']?prop['chart.tooltips'][0]:null};}
39
+ return null;};this.highlight=this.Highlight=function(shape)
40
+ {if(prop['chart.tooltips.highlight']){if(typeof prop['chart.highlight.style']==='function'){(prop['chart.highlight.style'])(shape);}else{pa2(co,['b','r',this.coords[0][0],this.coords[0][1],this.coords[0][2],this.coords[0][3],'f',prop['chart.highlight.fill'],'s',prop['chart.highlight.stroke']]);}}};this.parseColors=function()
41
+ {if(this.original_colors.length===0){this.original_colors['chart.highlight.stroke']=RG.array_clone(prop['chart.highlight.stroke']);this.original_colors['chart.highlight.fill']=RG.array_clone(prop['chart.highlight.fill']);}
42
+ prop['chart.highlight.stroke']=this.parseSingleColorForGradient(prop['chart.highlight.stroke']);prop['chart.highlight.fill']=this.parseSingleColorForGradient(prop['chart.highlight.fill']);};this.reset=function()
43
+ {};this.parseSingleColorForGradient=function(color)
44
+ {if(!color){return color;}
45
+ if(typeof color==='string'&&color.match(/^gradient\((.*)\)$/i)){var parts=RegExp.$1.split(':'),grad=co.createLinearGradient(this.x,this.y,this.x+this.img.width,this.y),diff=1/(parts.length-1);grad.addColorStop(0,RG.trim(parts[0]));for(var j=1;j<parts.length;++j){grad.addColorStop(j*diff,RG.trim(parts[j]));}}
46
+ return grad?grad:color;};this.on=function(type,func)
47
+ {if(type.substr(0,2)!=='on'){type='on'+type;}
48
+ if(typeof this[type]!=='function'){this[type]=func;}else{RG.addCustomEventListener(this,type,func);}
49
+ return this;};this.firstDrawFunc=function()
50
+ {};this.roundedRect=function(x,y,width,height,radius)
51
+ {co.save();co.translate(x,y);co.moveTo(width/2,0);co.arcTo(width,0,width,height,ma.min(height/2,radius));co.arcTo(width,height,0,height,ma.min(width/2,radius));co.arcTo(0,height,0,0,ma.min(height/2,radius));co.arcTo(0,0,radius,0,ma.min(width/2,radius));co.lineTo(width/2,0);co.restore();};this.drawBackgroundColor=function(borderRadius)
52
+ {co.beginPath();co.fillStyle=prop['chart.background.color'];this.roundedRect(ma.round(this.x)-ma.round(co.lineWidth/2),ma.round(this.y)-ma.round(co.lineWidth/2),(prop['chart.width']||this.img.width)+co.lineWidth,(prop['chart.height']||this.img.height)+co.lineWidth,borderRadius);co.fill();};RG.register(this);if(parseConfObjectForOptions){RG.parseObjectStyleConfig(this,conf.options);}};