rgraph-rails 4.62 → 4.64

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 +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,302 +1,20 @@
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
- ModalDialog =
14
- {
15
- dialog: null,
16
- background: null,
17
- offset: 50,
18
- events: [],
19
1
 
20
-
21
-
22
-
23
- /**
24
- * Shows the dialog with the supplied DIV acting as the contents
25
- *
26
- * @param string id The ID of the DIV to use as the dialogs contents
27
- * @param int width The width of the dialog
28
- */
29
- Show: function (id, width)
30
- {
31
- ModalDialog.id = id;
32
- ModalDialog.width = width;
33
-
34
- ModalDialog.ShowBackground();
35
- ModalDialog.ShowDialog();
36
-
37
- // Install the event handlers
38
- window.onresize = ModalDialog.Resize;
39
-
40
- // Add an event listener so that the
41
- // ESC key hides the dialog
42
- document.body.addEventListener('keydown', function (e)
43
- {
44
- if (e.keyCode === 27) {
45
- ModalDialog.hide();
46
- }
47
- }, false);
48
-
49
-
50
- // Call them initially
51
- ModalDialog.Resize();
52
-
53
- if (typeof(ModalDialog.onmodaldialog) == 'function') {
54
- ModalDialog.onmodaldialog();
55
- }
56
- ModalDialog.FireCustomEvent('onmodaldialog');
57
- },
58
-
59
-
60
-
61
-
62
- /**
63
- * Shows the background semi-transparent darkened DIV
64
- */
65
- ShowBackground: function ()
66
- {
67
- // Create the background if neccessary
68
- ModalDialog.background = document.createElement('DIV');
69
- ModalDialog.background.className = 'ModalDialog_background';
70
- ModalDialog.background.style.position = 'fixed';
71
- ModalDialog.background.style.top = 0;
72
- ModalDialog.background.style.left = 0;
73
- ModalDialog.background.style.width = (screen.width + 100) + 'px';
74
- ModalDialog.background.style.height = (screen.height + 100) + 'px';
75
- ModalDialog.background.style.backgroundColor = 'rgb(204,204,204)';
76
- ModalDialog.background.style.opacity = 0;
77
- ModalDialog.background.style.zIndex = 3276;
78
- ModalDialog.background.style.filter = "Alpha(opacity=50)";
79
-
80
- document.body.appendChild(ModalDialog.background);
81
-
82
- ModalDialog.background.style.visibility = 'visible';
83
- },
84
-
85
-
86
-
87
-
88
- /**
89
- * Shows the dialog itself
90
- */
91
- ShowDialog: function ()
92
- {
93
- // Create the DIV if necessary
94
- // Jan 2012- Changed so that the dialog is ALWAYS (re)created
95
- if (!ModalDialog.dialog || true) {
96
- ModalDialog.dialog = document.createElement('DIV');
97
-
98
- ModalDialog.dialog.id = 'ModalDialog_dialog';
99
- ModalDialog.dialog.className = 'ModalDialog_dialog';
100
-
101
- var borderRadius = '15px';
102
-
103
- ModalDialog.dialog.style.borderRadius = borderRadius;
104
- ModalDialog.dialog.style.MozBorderRadius = borderRadius;
105
- ModalDialog.dialog.style.WebkitBorderRadius = borderRadius;
106
-
107
- ModalDialog.dialog.style.boxShadow = '3px 3px 3px rgba(96,96,96,0.5)';
108
- ModalDialog.dialog.style.MozBoxShadow = '3px 3px 3px rgba(96,96,96,0.5)';
109
- ModalDialog.dialog.style.WebkitBoxShadow = 'rgba(96,96,96,0.5) 3px 3px 3px';
110
-
111
- ModalDialog.dialog.style.position = 'fixed';
112
- ModalDialog.dialog.style.backgroundColor = 'white';
113
- ModalDialog.dialog.style.width = parseInt(ModalDialog.width) + 'px';
114
- ModalDialog.dialog.style.border = '2px solid #999';
115
- ModalDialog.dialog.style.zIndex = 32767;
116
- ModalDialog.dialog.style.padding = '5px';
117
- ModalDialog.dialog.style.paddingTop = '25px';
118
- ModalDialog.dialog.style.opacity = 0;
119
-
120
- if (document.all) {
121
- ModalDialog.dialog.style.zIndex = 32767;
122
- }
123
-
124
-
125
-
126
- // Accomodate various browsers
127
- if (navigator.userAgent.indexOf('Opera') != -1) {
128
- ModalDialog.dialog.style.paddingTop = '25px';
129
-
130
- } else if (navigator.userAgent.indexOf('MSIE') != -1) {
131
- ModalDialog.dialog.style.paddingTop = '25px';
132
-
133
- } else if (navigator.userAgent.indexOf('Safari') != -1) {
134
- ModalDialog.dialog.style.paddingTop = '25px';
135
- }
136
-
137
- document.body.appendChild(ModalDialog.dialog);
138
-
139
-
140
- // Now create the grey bar at the top of the dialog
141
- var bar = document.createElement('DIV');
142
- bar.className = 'ModalDialog_topbar';
143
- bar.style.top = 0;
144
- bar.style.left = 0;
145
- bar.style.width = '100%';//(ModalDialog.dialog.offsetWidth - 4) + 'px';
146
- bar.style.height = '20px';
147
- bar.style.backgroundColor = '#bbb';
148
- bar.style.borderBottom = '2px solid #999';
149
- //bar.style.zIndex = 50000;
150
- bar.style.position = 'absolute';
151
- var borderRadius = '11px';
152
- bar.style.WebkitBorderTopLeftRadius = borderRadius;
153
- bar.style.WebkitBorderTopRightRadius = borderRadius;
154
- bar.style.MozBorderRadiusTopleft = borderRadius;
155
- bar.style.MozBorderRadiusTopright = borderRadius;
156
- bar.style.borderTopRightRadius = borderRadius;
157
- bar.style.borderTopLeftRadius = borderRadius;
158
- ModalDialog.dialog.appendChild(bar);
159
-
160
- // Add the content div
161
- var content = document.createElement('DIV');
162
- //content.style.paddingTop = '20px';
163
- content.style.width = '100%';
164
- content.style.height = '100%';
165
- ModalDialog.dialog.appendChild(content);
166
-
167
- if (ModalDialog.id.toLowerCase().substring(0, 7) == 'string:') {
168
- content.innerHTML = ModalDialog.id.substring(7);
169
- } else {
170
- content.innerHTML = document.getElementById(ModalDialog.id).innerHTML;
171
- }
172
-
173
- // Now reposition the dialog in the center
174
- ModalDialog.dialog.style.left = (document.body.offsetWidth / 2) - (ModalDialog.dialog.offsetWidth / 2) + 'px';
175
- ModalDialog.dialog.style.top = '30%';
176
- }
177
-
178
- // Show the dialog
179
- ModalDialog.dialog.style.visibility = 'visible';
180
-
181
- // A simple fade-in effect
182
- setTimeout('ModalDialog.dialog.style.opacity = 0.2', 50);
183
- setTimeout('ModalDialog.dialog.style.opacity = 0.4', 100);
184
- setTimeout('ModalDialog.dialog.style.opacity = 0.6', 150);
185
- setTimeout('ModalDialog.dialog.style.opacity = 0.8', 200);
186
- setTimeout('ModalDialog.dialog.style.opacity = 1', 250);
187
-
188
- setTimeout('ModalDialog.background.style.opacity = 0.1', 50);
189
- setTimeout('ModalDialog.background.style.opacity = 0.2', 100);
190
- setTimeout('ModalDialog.background.style.opacity = 0.3', 150);
191
- setTimeout('ModalDialog.background.style.opacity = 0.4', 200);
192
- setTimeout('ModalDialog.background.style.opacity = 0.5', 250);
193
- },
194
-
195
-
196
-
197
-
198
- /**
199
- * Hides everything
200
- */
201
- Close: function ()
202
- {
203
- if (ModalDialog.dialog) {
204
- // February 2012 - now remove the dialog node from the DOM
205
- if (document.getElementById(ModalDialog.dialog.id)) {
206
- document.body.removeChild(ModalDialog.dialog);
207
- }
208
-
209
- ModalDialog.dialog.style.visibility = 'hidden';
210
- ModalDialog.dialog.style.opacity = 0;
211
- }
212
-
213
- if (ModalDialog.background) {
214
- ModalDialog.background.style.visibility = 'hidden';
215
- ModalDialog.background.style.opacity = 0;
216
-
217
- // February 2012 - now remove the dialog node from the DOM
218
- if (document.getElementById(ModalDialog.background.id)) {
219
- document.body.removeChild(ModalDialog.background);
220
- }
221
- }
222
- },
223
-
224
-
225
-
226
-
227
- /**
228
- * Accommodate the window being resized
229
- */
230
- Resize: function ()
231
- {
232
- if (ModalDialog.dialog) {
233
- ModalDialog.dialog.style.left = (document.body.offsetWidth / 2) - (ModalDialog.dialog.offsetWidth / 2) + 'px';
234
- }
235
-
236
- ModalDialog.background.style.width = '2500px';
237
- ModalDialog.background.style.height = '2500px';
238
- },
239
-
240
-
241
-
242
-
243
- /**
244
- * Returns the page height
245
- *
246
- * @return int The page height
247
- */
248
- AddCustomEventListener: function (name, func)
249
- {
250
- if (typeof(ModalDialog.events) == 'undefined') {
251
- ModalDialog.events = [];
252
- }
253
-
254
- ModalDialog.events.push([name, func]);
255
- },
256
-
257
-
258
-
259
-
260
- /**
261
- * Used to fire the ModalDialog custom event
262
- *
263
- * @param object obj The graph object that fires the event
264
- * @param string event The name of the event to fire
265
- */
266
- FireCustomEvent: function (name)
267
- {
268
- for (var i=0; i<ModalDialog.events.length; ++i) {
269
- if (typeof(ModalDialog.events[i][0]) == 'string' && ModalDialog.events[i][0] == name && typeof(ModalDialog.events[i][1]) == 'function') {
270
- ModalDialog.events[i][1]();
271
- }
272
- }
273
- },
274
-
275
-
276
-
277
-
278
- /**
279
- * Returns true if the browser is IE8
280
- */
281
- isIE8: function ()
282
- {
283
- return document.all && (navigator.userAgent.indexOf('MSIE 8') > 0);
284
- }
285
- };
286
-
287
-
288
-
289
-
290
- // Aliases
291
- ModalDialog.show = ModalDialog.Show;
292
- ModalDialog.draw = ModalDialog.Show;
293
- ModalDialog.Hide = ModalDialog.Close;
294
- ModalDialog.hide = ModalDialog.Close;
295
- ModalDialog.close = ModalDialog.Close;
296
-
297
- // Lowercase all of the function names
298
- for (i in ModalDialog) {
299
- if (typeof ModalDialog[i] === 'function') {
300
- ModalDialog[i.toLowerCase()] = ModalDialog[i]
301
- }
302
- }
2
+ ModalDialog={dialog:null,background:null,offset:50,events:[],Show:function(id,width)
3
+ {ModalDialog.id=id;ModalDialog.width=width;ModalDialog.ShowBackground();ModalDialog.ShowDialog();window.onresize=ModalDialog.Resize;document.body.addEventListener('keydown',function(e)
4
+ {if(e.keyCode===27){ModalDialog.hide();}},false);ModalDialog.Resize();if(typeof(ModalDialog.onmodaldialog)=='function'){ModalDialog.onmodaldialog();}
5
+ ModalDialog.FireCustomEvent('onmodaldialog');},ShowBackground:function()
6
+ {ModalDialog.background=document.createElement('DIV');ModalDialog.background.className='ModalDialog_background';ModalDialog.background.style.position='fixed';ModalDialog.background.style.top=0;ModalDialog.background.style.left=0;ModalDialog.background.style.width=(screen.width+100)+'px';ModalDialog.background.style.height=(screen.height+100)+'px';ModalDialog.background.style.backgroundColor='rgb(204,204,204)';ModalDialog.background.style.opacity=0;ModalDialog.background.style.zIndex=3276;ModalDialog.background.style.filter="Alpha(opacity=50)";document.body.appendChild(ModalDialog.background);ModalDialog.background.style.visibility='visible';},ShowDialog:function()
7
+ {if(!ModalDialog.dialog||true){ModalDialog.dialog=document.createElement('DIV');ModalDialog.dialog.id='ModalDialog_dialog';ModalDialog.dialog.className='ModalDialog_dialog';var borderRadius='15px';ModalDialog.dialog.style.borderRadius=borderRadius;ModalDialog.dialog.style.MozBorderRadius=borderRadius;ModalDialog.dialog.style.WebkitBorderRadius=borderRadius;ModalDialog.dialog.style.boxShadow='3px 3px 3px rgba(96,96,96,0.5)';ModalDialog.dialog.style.MozBoxShadow='3px 3px 3px rgba(96,96,96,0.5)';ModalDialog.dialog.style.WebkitBoxShadow='rgba(96,96,96,0.5) 3px 3px 3px';ModalDialog.dialog.style.position='fixed';ModalDialog.dialog.style.backgroundColor='white';ModalDialog.dialog.style.width=parseInt(ModalDialog.width)+'px';ModalDialog.dialog.style.border='2px solid #999';ModalDialog.dialog.style.zIndex=32767;ModalDialog.dialog.style.padding='5px';ModalDialog.dialog.style.paddingTop='25px';ModalDialog.dialog.style.opacity=0;if(document.all){ModalDialog.dialog.style.zIndex=32767;}
8
+ if(navigator.userAgent.indexOf('Opera')!=-1){ModalDialog.dialog.style.paddingTop='25px';}else if(navigator.userAgent.indexOf('MSIE')!=-1){ModalDialog.dialog.style.paddingTop='25px';}else if(navigator.userAgent.indexOf('Safari')!=-1){ModalDialog.dialog.style.paddingTop='25px';}
9
+ document.body.appendChild(ModalDialog.dialog);var bar=document.createElement('DIV');bar.className='ModalDialog_topbar';bar.style.top=0;bar.style.left=0;bar.style.width='100%';bar.style.height='20px';bar.style.backgroundColor='#bbb';bar.style.borderBottom='2px solid #999';bar.style.position='absolute';var borderRadius='11px';bar.style.WebkitBorderTopLeftRadius=borderRadius;bar.style.WebkitBorderTopRightRadius=borderRadius;bar.style.MozBorderRadiusTopleft=borderRadius;bar.style.MozBorderRadiusTopright=borderRadius;bar.style.borderTopRightRadius=borderRadius;bar.style.borderTopLeftRadius=borderRadius;ModalDialog.dialog.appendChild(bar);var content=document.createElement('DIV');content.style.width='100%';content.style.height='100%';ModalDialog.dialog.appendChild(content);if(ModalDialog.id.toLowerCase().substring(0,7)=='string:'){content.innerHTML=ModalDialog.id.substring(7);}else{content.innerHTML=document.getElementById(ModalDialog.id).innerHTML;}
10
+ ModalDialog.dialog.style.left=(document.body.offsetWidth/2)-(ModalDialog.dialog.offsetWidth/2)+'px';ModalDialog.dialog.style.top='30%';}
11
+ ModalDialog.dialog.style.visibility='visible';setTimeout('ModalDialog.dialog.style.opacity = 0.2',50);setTimeout('ModalDialog.dialog.style.opacity = 0.4',100);setTimeout('ModalDialog.dialog.style.opacity = 0.6',150);setTimeout('ModalDialog.dialog.style.opacity = 0.8',200);setTimeout('ModalDialog.dialog.style.opacity = 1',250);setTimeout('ModalDialog.background.style.opacity = 0.1',50);setTimeout('ModalDialog.background.style.opacity = 0.2',100);setTimeout('ModalDialog.background.style.opacity = 0.3',150);setTimeout('ModalDialog.background.style.opacity = 0.4',200);setTimeout('ModalDialog.background.style.opacity = 0.5',250);},Close:function()
12
+ {if(ModalDialog.dialog){if(document.getElementById(ModalDialog.dialog.id)){document.body.removeChild(ModalDialog.dialog);}
13
+ ModalDialog.dialog.style.visibility='hidden';ModalDialog.dialog.style.opacity=0;}
14
+ if(ModalDialog.background){ModalDialog.background.style.visibility='hidden';ModalDialog.background.style.opacity=0;if(document.getElementById(ModalDialog.background.id)){document.body.removeChild(ModalDialog.background);}}},Resize:function()
15
+ {if(ModalDialog.dialog){ModalDialog.dialog.style.left=(document.body.offsetWidth/2)-(ModalDialog.dialog.offsetWidth/2)+'px';}
16
+ ModalDialog.background.style.width='2500px';ModalDialog.background.style.height='2500px';},AddCustomEventListener:function(name,func)
17
+ {if(typeof(ModalDialog.events)=='undefined'){ModalDialog.events=[];}
18
+ ModalDialog.events.push([name,func]);},FireCustomEvent:function(name)
19
+ {for(var i=0;i<ModalDialog.events.length;++i){if(typeof(ModalDialog.events[i][0])=='string'&&ModalDialog.events[i][0]==name&&typeof(ModalDialog.events[i][1])=='function'){ModalDialog.events[i][1]();}}},isIE8:function()
20
+ {return document.all&&(navigator.userAgent.indexOf('MSIE 8')>0);}};ModalDialog.show=ModalDialog.Show;ModalDialog.draw=ModalDialog.Show;ModalDialog.Hide=ModalDialog.Close;ModalDialog.hide=ModalDialog.Close;ModalDialog.close=ModalDialog.Close;for(i in ModalDialog){if(typeof ModalDialog[i]==='function'){ModalDialog[i.toLowerCase()]=ModalDialog[i]}}
@@ -1,1265 +1,72 @@
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
1
 
13
- RGraph = window.RGraph || {isRGraph: true};
14
-
15
- /**
16
- * The odometer constructor. Pass it the ID of the canvas tag, the start value of the odo,
17
- * the end value, and the value that the pointer should point to.
18
- *
19
- * @param string id The ID of the canvas tag
20
- * @param int start The start value of the Odo
21
- * @param int end The end value of the odo
22
- * @param int value The indicated value (what the needle points to)
23
- */
24
- RGraph.Odometer = function (conf)
25
- {
26
- /**
27
- * Allow for object config style
28
- */
29
- if ( typeof conf === 'object'
30
- && typeof conf.value !== 'undefined'
31
- && typeof conf.id === 'string') {
32
-
33
- var id = conf.id
34
- var canvas = document.getElementById(id);
35
- var min = conf.min;
36
- var max = conf.max;
37
- var value = conf.value;
38
- var parseConfObjectForOptions = true; // Set this so the config is parsed (at the end of the constructor)
39
-
40
- } else {
41
-
42
- var id = conf;
43
- var canvas = document.getElementById(id);
44
- var min = arguments[1];
45
- var max = arguments[2];
46
- var value = arguments[3];
47
- }
48
-
49
-
50
-
51
-
52
- this.id = id;
53
- this.canvas = canvas;
54
- this.context = this.canvas.getContext ? this.canvas.getContext("2d", {alpha: (typeof id === 'object' && id.alpha === false) ? false : true}) : null;
55
- this.canvas.__object__ = this;
56
- this.type = 'odo';
57
- this.isRGraph = true;
58
- this.min = RGraph.stringsToNumbers(min);
59
- this.max = RGraph.stringsToNumbers(max);
60
- this.value = RGraph.stringsToNumbers(value);
61
- this.currentValue = null;
62
- this.uid = RGraph.CreateUID();
63
- this.canvas.uid = this.canvas.uid ? this.canvas.uid : RGraph.CreateUID();
64
- this.colorsParsed = false;
65
- this.coordsText = [];
66
- this.original_colors = [];
67
- this.firstDraw = true; // After the first draw this will be false
68
-
69
-
70
- /**
71
- * Compatibility with older browsers
72
- */
73
- //RGraph.OldBrowserCompat(this.context);
74
-
75
-
76
- this.properties =
77
- {
78
- 'chart.background.border': 'black',
79
- 'chart.background.color': '#eee',
80
- 'chart.background.lines.color': '#ddd',
81
- 'chart.centerx': null,
82
- 'chart.centery': null,
83
- 'chart.radius': null,
84
- 'chart.value.text': false,
85
- 'chart.value.text.decimals': 0,
86
- 'chart.needle.color': 'black',
87
- 'chart.needle.width': 2,
88
- 'chart.needle.head': true,
89
- 'chart.needle.tail': true,
90
- 'chart.needle.type': 'pointer',
91
- 'chart.needle.extra': [],
92
- 'chart.needle.triangle.border': '#aaa',
93
- 'chart.text.size': 12,
94
- 'chart.text.color': 'black',
95
- 'chart.text.font': 'Segoe UI, Arial, Verdana, sans-serif',
96
- 'chart.text.accessible': false,
97
- 'chart.text.accessible.overflow': 'visible',
98
- 'chart.text.accessible.pointerevents': true,
99
- 'chart.green.max': max * 0.75,
100
- 'chart.red.min': max * 0.9,
101
- 'chart.green.color': 'Gradient(white:#0c0)',
102
- 'chart.yellow.color': 'Gradient(white:#ff0)',
103
- 'chart.red.color': 'Gradient(white:#f00)',
104
- 'chart.label.area': 35,
105
- 'chart.gutter.left': 25,
106
- 'chart.gutter.right': 25,
107
- 'chart.gutter.top': 25,
108
- 'chart.gutter.bottom': 25,
109
- 'chart.title': '',
110
- 'chart.title.background': null,
111
- 'chart.title.hpos': null,
112
- 'chart.title.vpos': null,
113
- 'chart.title.font': null,
114
- 'chart.title.bold': true,
115
- 'chart.title.x': null,
116
- 'chart.title.y': null,
117
- 'chart.title.halign': null,
118
- 'chart.title.valign': null,
119
- 'chart.contextmenu': null,
120
- 'chart.linewidth': 1,
121
- 'chart.shadow.inner': false,
122
- 'chart.shadow.inner.color': 'black',
123
- 'chart.shadow.inner.offsetx': 3,
124
- 'chart.shadow.inner.offsety': 3,
125
- 'chart.shadow.inner.blur': 6,
126
- 'chart.shadow.outer': false,
127
- 'chart.shadow.outer.color': 'black',
128
- 'chart.shadow.outer.offsetx': 3,
129
- 'chart.shadow.outer.offsety': 3,
130
- 'chart.shadow.outer.blur': 6,
131
- 'chart.annotatable': false,
132
- 'chart.annotate.color': 'black',
133
- 'chart.scale.decimals': 0,
134
- 'chart.scale.point': '.',
135
- 'chart.scale.thousand': ',',
136
- 'chart.zoom.factor': 1.5,
137
- 'chart.zoom.fade.in': true,
138
- 'chart.zoom.fade.out': true,
139
- 'chart.zoom.hdir': 'right',
140
- 'chart.zoom.vdir': 'down',
141
- 'chart.zoom.frames': 25,
142
- 'chart.zoom.delay': 16.666,
143
- 'chart.zoom.shadow': true,
144
- 'chart.zoom.background': true,
145
- 'chart.zoom.action': 'zoom',
146
- 'chart.resizable': false,
147
- 'chart.resize.handle.adjust': [0,0],
148
- 'chart.resize.handle.background': null,
149
- 'chart.units.pre': '',
150
- 'chart.units.post': '',
151
- 'chart.border': false,
152
- 'chart.border.color1': '#BEBCB0',
153
- 'chart.border.color2': '#F0EFEA',
154
- 'chart.border.color3': '#BEBCB0',
155
- 'chart.tickmarks': true,
156
- 'chart.tickmarks.highlighted': false,
157
- 'chart.tickmarks.big.color': '#999',
158
- 'chart.zerostart': false,
159
- 'chart.labels': null,
160
- 'chart.units.pre': '',
161
- 'chart.units.post': '',
162
- 'chart.value.units.pre': '',
163
- 'chart.value.units.post': '',
164
- 'chart.key': null,
165
- 'chart.key.background': 'white',
166
- 'chart.key.position': 'graph',
167
- 'chart.key.shadow': false,
168
- 'chart.key.shadow.color': '#666',
169
- 'chart.key.shadow.blur': 3,
170
- 'chart.key.shadow.offsetx': 2,
171
- 'chart.key.shadow.offsety': 2,
172
- 'chart.key.position.gutter.boxed':false,
173
- 'chart.key.position.x': null,
174
- 'chart.key.position.y': null,
175
- 'chart.key.halign': 'right',
176
- 'chart.key.color.shape': 'square',
177
- 'chart.key.rounded': true,
178
- 'chart.key.text.size': 10,
179
- 'chart.key.colors': null,
180
- 'chart.key.text.color': 'black',
181
- 'chart.adjustable': false,
182
- 'chart.clearto': 'rgba(0,0,0,0)'
183
- }
184
-
185
-
186
-
187
- /*
188
- * Translate half a pixel for antialiasing purposes - but only if it hasn't beeen
189
- * done already
190
- */
191
- if (!this.canvas.__rgraph_aa_translated__) {
192
- this.context.translate(0.5,0.5);
193
-
194
- this.canvas.__rgraph_aa_translated__ = true;
195
- }
196
-
197
-
198
-
199
- // Short variable names
200
- var RG = RGraph,
201
- ca = this.canvas,
202
- co = ca.getContext('2d'),
203
- prop = this.properties,
204
- pa2 = RG.path2,
205
- win = window,
206
- doc = document,
207
- ma = Math
208
-
209
-
210
-
211
- /**
212
- * "Decorate" the object with the generic effects if the effects library has been included
213
- */
214
- if (RG.Effects && typeof RG.Effects.decorate === 'function') {
215
- RG.Effects.decorate(this);
216
- }
217
-
218
-
219
-
220
-
221
- /**
222
- * A peudo setter
223
- *
224
- * @param name string The name of the property to set
225
- * @param value mixed The value of the property
226
- */
227
- this.set =
228
- this.Set = function (name, value)
229
- {
230
- var value = arguments[1] || null;
231
-
232
- /**
233
- * the number of arguments is only one and it's an
234
- * object - parse it for configuration data and return.
235
- */
236
- if (arguments.length === 1 && typeof name === 'object') {
237
- RG.parseObjectStyleConfig(this, name);
238
- return this;
239
- }
240
-
241
-
242
-
243
-
244
-
245
- /**
246
- * This should be done first - prepend the property name with "chart." if necessary
247
- */
248
- if (name.substr(0,6) != 'chart.') {
249
- name = 'chart.' + name;
250
- }
251
-
252
-
253
-
254
-
255
- // Convert uppercase letters to dot+lower case letter
256
- while(name.match(/([A-Z])/)) {
257
- name = name.replace(/([A-Z])/, '.' + RegExp.$1.toLowerCase());
258
- }
259
-
260
- if (name == 'chart.needle.style') {
261
- alert('[RGRAPH] The RGraph property chart.needle.style has changed to chart.needle.color');
262
- }
263
-
264
- if (name == 'chart.needle.thickness') {
265
- name = 'chart.needle.width';
266
- }
267
-
268
- if (name == 'chart.value') {
269
- this.value = value;
270
- return;
271
- }
272
-
273
-
274
-
275
-
276
-
277
-
278
- prop[name] = value;
279
-
280
- return this;
281
- };
282
-
283
-
284
-
285
-
286
- /**
287
- * A getter
288
- *
289
- * @param name string The name of the property to get
290
- */
291
- this.get =
292
- this.Get = function (name)
293
- {
294
- /**
295
- * This should be done first - prepend the property name with "chart." if necessary
296
- */
297
- if (name.substr(0,6) != 'chart.') {
298
- name = 'chart.' + name;
299
- }
300
-
301
- // Convert uppercase letters to dot+lower case letter
302
- while(name.match(/([A-Z])/)) {
303
- name = name.replace(/([A-Z])/, '.' + RegExp.$1.toLowerCase());
304
- }
305
-
306
- if (name == 'chart.value') {
307
- return this.value;
308
- }
309
-
310
- return prop[name.toLowerCase()];
311
- };
312
-
313
-
314
-
315
-
316
- /**
317
- * Draws the odometer
318
- */
319
- this.draw =
320
- this.Draw = function ()
321
- {
322
- /**
323
- * Fire the onbeforedraw event
324
- */
325
- RG.FireCustomEvent(this, 'onbeforedraw');
326
-
327
-
328
- /**
329
- * Set the current value
330
- */
331
- this.currentValue = this.value;
332
-
333
- /**
334
- * No longer allow values outside the range of the Odo
335
- */
336
- if (this.value > this.max) {
337
- this.value = this.max;
338
- }
339
-
340
- if (this.value < this.min) {
341
- this.value = this.min;
342
- }
343
-
344
- /**
345
- * This is new in May 2011 and facilitates indiviual gutter settings,
346
- * eg chart.gutter.left
347
- */
348
- this.gutterLeft = prop['chart.gutter.left'];
349
- this.gutterRight = prop['chart.gutter.right'];
350
- this.gutterTop = prop['chart.gutter.top'];
351
- this.gutterBottom = prop['chart.gutter.bottom'];
352
-
353
- // Work out a few things
354
- this.radius = Math.min(
355
- (ca.width - this.gutterLeft - this.gutterRight) / 2,
356
- (ca.height - this.gutterTop - this.gutterBottom) / 2
357
- )
358
- - (prop['chart.border'] ? 25 : 0);
359
- this.diameter = 2 * this.radius;
360
- this.centerx = ((ca.width - this.gutterLeft- this.gutterRight) / 2) + this.gutterLeft;
361
- this.centery = ((ca.height - this.gutterTop - this.gutterBottom) / 2) + this.gutterTop;
362
- this.range = this.max - this.min;
363
- this.coordsText = [];
364
-
365
- /**
366
- * Move the centerx if the key is defined
367
- */
368
- if (prop['chart.key'] && prop['chart.key'].length > 0 && ca.width > ca.height) this.centerx = 5 + this.radius;
369
- if (typeof(prop['chart.centerx']) == 'number') this.centerx = prop['chart.centerx'];
370
- if (typeof(prop['chart.centery']) == 'number') this.centery = prop['chart.centery'];
371
-
372
-
373
- /**
374
- * Allow custom setting of the radius
375
- */
376
- if (typeof(prop['chart.radius']) == 'number') {
377
- this.radius = prop['chart.radius'];
378
-
379
- if (prop['chart.border']) {
380
- this.radius -= 25;
381
- }
382
- }
383
-
384
-
385
- /**
386
- * Parse the colors for gradients. Its down here so that the center X/Y can be used
387
- */
388
- if (!this.colorsParsed) {
389
-
390
- this.parseColors();
391
-
392
- // Don't want to do this again
393
- this.colorsParsed = true;
394
- }
395
-
396
-
397
-
398
- co.lineWidth = prop['chart.linewidth'];
399
-
400
- // Draw the background
401
- this.DrawBackground();
402
-
403
- // And lastly, draw the labels
404
- this.DrawLabels();
405
-
406
- // Draw the needle
407
- this.DrawNeedle(this.value, prop['chart.needle.color']);
408
-
409
- /**
410
- * Draw any extra needles
411
- */
412
- if (prop['chart.needle.extra'].length > 0) {
413
- for (var i=0; i<prop['chart.needle.extra'].length; ++i) {
414
- var needle = prop['chart.needle.extra'][i];
415
- this.DrawNeedle(needle[0], needle[1], needle[2]);
416
- }
417
- }
418
-
419
- /**
420
- * Draw the key if requested
421
- */
422
- if (prop['chart.key'] && prop['chart.key'].length > 0) {
423
- // Build a colors array out of the needle colors
424
- var colors = [prop['chart.needle.color']];
425
-
426
- if (prop['chart.needle.extra'].length > 0) {
427
- for (var i=0; i<prop['chart.needle.extra'].length; ++i) {
428
- var needle = prop['chart.needle.extra'][i];
429
- colors.push(needle[1]);
430
- }
431
- }
432
-
433
- RG.DrawKey(this, prop['chart.key'], colors);
434
- }
435
-
436
-
437
- /**
438
- * Setup the context menu if required
439
- */
440
- if (prop['chart.contextmenu']) {
441
- RG.ShowContext(this);
442
- }
443
-
444
-
445
- /**
446
- * This function enables resizing
447
- */
448
- if (prop['chart.resizable']) {
449
- RG.AllowResizing(this);
450
- }
451
-
452
-
453
- /**
454
- * This installs the event listeners
455
- */
456
- RG.InstallEventListeners(this);
457
-
458
-
459
-
460
- /**
461
- * Fire the onfirstdraw event
462
- */
463
- if (this.firstDraw) {
464
- RG.fireCustomEvent(this, 'onfirstdraw');
465
- this.firstDraw = false;
466
- this.firstDrawFunc();
467
- }
468
-
469
-
470
-
471
-
472
- /**
473
- * Fire the RGraph ondraw event
474
- */
475
- RG.FireCustomEvent(this, 'ondraw');
476
-
477
- return this;
478
- };
479
-
480
-
481
-
482
- /**
483
- * Used in chaining. Runs a function there and then - not waiting for
484
- * the events to fire (eg the onbeforedraw event)
485
- *
486
- * @param function func The function to execute
487
- */
488
- this.exec = function (func)
489
- {
490
- func(this);
491
-
492
- return this;
493
- };
494
-
495
-
496
-
497
-
498
- /**
499
- * Draws the background
500
- */
501
- this.drawBackground =
502
- this.DrawBackground = function ()
503
- {
504
- co.beginPath();
505
-
506
- /**
507
- * Turn on the shadow if need be
508
- */
509
- if (prop['chart.shadow.outer']) {
510
- RG.setShadow(this, prop['chart.shadow.outer.color'], prop['chart.shadow.outer.offsetx'], prop['chart.shadow.outer.offsety'], prop['chart.shadow.outer.blur']);
511
- }
512
-
513
- var backgroundColor = prop['chart.background.color'];
514
-
515
- // Draw the grey border
516
- co.fillStyle = backgroundColor;
517
- co.arc(this.centerx, this.centery, this.radius, 0.0001, RG.TWOPI, false);
518
- co.fill();
519
-
520
- /**
521
- * Turn off the shadow
522
- */
523
- RG.noShadow(this);
524
-
525
-
526
- // Draw a circle
527
- co.strokeStyle = '#666';
528
- co.arc(this.centerx, this.centery, this.radius, 0, RG.TWOPI, false);
529
-
530
- // Now draw a big white circle to make the lines appear as tick marks
531
- // This is solely for Chrome
532
- co.fillStyle = backgroundColor;
533
- co.arc(this.centerx, this.centery, this.radius, 0, RG.TWOPI, false);
534
- co.fill();
535
-
536
- /**
537
- * Draw more tickmarks
538
- */
539
- if (prop['chart.tickmarks']) {
540
- co.beginPath();
541
- co.strokeStyle = '#bbb';
542
-
543
- for (var i=0; i<=360; i+=3) {
544
- co.arc(this.centerx, this.centery, this.radius, 0, i / 57.3, false);
545
- co.lineTo(this.centerx, this.centery);
546
- }
547
- co.stroke();
548
- }
549
-
550
- co.beginPath();
551
- co.lineWidth = 1;
552
- co.strokeStyle = 'black';
553
-
554
- // Now draw a big white circle to make the lines appear as tick marks
555
- co.fillStyle = backgroundColor;
556
- co.strokeStyle = backgroundColor;
557
- co.arc(this.centerx, this.centery, this.radius - 5, 0, RG.TWOPI, false);
558
- co.fill();
559
- co.stroke();
560
-
561
- // Gray lines at 18 degree intervals
562
- co.beginPath();
563
- co.strokeStyle = prop['chart.background.lines.color'];
564
- for (var i=0; i<360; i+=18) {
565
- co.arc(this.centerx, this.centery, this.radius, 0, RG.degrees2Radians(i), false);
566
- co.lineTo(this.centerx, this.centery);
567
- }
568
- co.stroke();
569
-
570
- // Redraw the outer circle
571
- co.beginPath();
572
- co.strokeStyle = prop['chart.background.border'];
573
- co.arc(this.centerx, this.centery, this.radius, 0, RG.TWOPI, false);
574
- co.stroke();
575
-
576
- /**
577
- * Now draw the center bits shadow if need be
578
- */
579
- if (prop['chart.shadow.inner']) {
580
- co.beginPath();
581
- RG.SetShadow(this, prop['chart.shadow.inner.color'], prop['chart.shadow.inner.offsetx'], prop['chart.shadow.inner.offsety'], prop['chart.shadow.inner.blur']);
582
- co.arc(this.centerx, this.centery, this.radius - prop['chart.label.area'], 0, RG.TWOPI, 0);
583
- co.fill();
584
- co.stroke();
585
-
586
- /**
587
- * Turn off the shadow
588
- */
589
- RG.NoShadow(this);
590
- }
591
-
592
- /*******************************************************
593
- * Draw the green area
594
- *******************************************************/
595
- var greengrad = prop['chart.green.color'];
596
-
597
- // Draw the "tick highlight"
598
- if (prop['chart.tickmarks.highlighted']) {
599
- co.beginPath();
600
- co.lineWidth = 5;
601
- co.strokeStyle = greengrad;
602
- co.arc(this.centerx, this.centery, this.radius - 2.5,
603
-
604
- -1 * RG.HALFPI,
605
- (((prop['chart.green.max'] - this.min)/ (this.max - this.min)) * RG.TWOPI) - RG.HALFPI,
606
- 0);
607
-
608
- co.stroke();
609
-
610
- co.lineWidth = 1;
611
- }
612
-
613
- co.beginPath();
614
- co.fillStyle = greengrad;
615
- co.arc(
616
- this.centerx,
617
- this.centery,
618
- this.radius - prop['chart.label.area'],
619
- 0 - RG.HALFPI,
620
- (((prop['chart.green.max'] - this.min)/ (this.max - this.min)) * RG.TWOPI) - RG.HALFPI,
621
- false
622
- );
623
- co.lineTo(this.centerx, this.centery);
624
- co.closePath();
625
- co.fill();
626
-
627
-
628
- /*******************************************************
629
- * Draw the yellow area
630
- *******************************************************/
631
- var yellowgrad = prop['chart.yellow.color'];
632
-
633
- // Draw the "tick highlight"
634
- if (prop['chart.tickmarks.highlighted']) {
635
- co.beginPath();
636
- co.lineWidth = 5;
637
- co.strokeStyle = yellowgrad;
638
- co.arc(this.centerx, this.centery, this.radius - 2.5, (
639
-
640
- ((prop['chart.green.max'] - this.min) / (this.max - this.min)) * RG.TWOPI) - RG.HALFPI,
641
- (((prop['chart.red.min'] - this.min) / (this.max - this.min)) * RG.TWOPI) - RG.HALFPI,
642
- 0);
643
-
644
- co.stroke();
645
-
646
- co.lineWidth = 1;
647
- }
648
-
649
- co.beginPath();
650
- co.fillStyle = yellowgrad;
651
- co.arc(
652
- this.centerx,
653
- this.centery,
654
- this.radius - prop['chart.label.area'],
655
- ( ((prop['chart.green.max'] - this.min) / (this.max - this.min)) * RG.TWOPI) - RG.HALFPI,
656
- ( ((prop['chart.red.min'] - this.min) / (this.max - this.min)) * RG.TWOPI) - RG.HALFPI,
657
- false
658
- );
659
- co.lineTo(this.centerx, this.centery);
660
- co.closePath();
661
- co.fill();
662
-
663
- /*******************************************************
664
- * Draw the red area
665
- *******************************************************/
666
- var redgrad = prop['chart.red.color'];
667
-
668
- // Draw the "tick highlight"
669
- if (prop['chart.tickmarks.highlighted']) {
670
- co.beginPath();
671
- co.lineWidth = 5;
672
- co.strokeStyle = redgrad;
673
- co.arc(this.centerx, this.centery, this.radius - 2.5,(((prop['chart.red.min'] - this.min) / (this.max - this.min)) * RG.TWOPI) - RG.HALFPI,RG.TWOPI - RG.HALFPI,0);
674
- co.stroke();
675
-
676
- co.lineWidth = 1;
677
- }
678
-
679
- co.beginPath();
680
- co.fillStyle = redgrad;
681
- co.strokeStyle = redgrad;
682
- co.arc(
683
- this.centerx,
684
- this.centery,
685
- this.radius - prop['chart.label.area'],
686
- (((prop['chart.red.min'] - this.min) / (this.max - this.min)) * RG.TWOPI) - RG.HALFPI,
687
- RG.TWOPI - RG.HALFPI,
688
- false
689
- );
690
- co.lineTo(this.centerx, this.centery);
691
- co.closePath();
692
- co.fill();
693
-
694
-
695
- /**
696
- * Draw the thick border
697
- */
698
- if (prop['chart.border']) {
699
-
700
- var grad = co.createRadialGradient(this.centerx, this.centery, this.radius, this.centerx, this.centery, this.radius + 20);
701
- grad.addColorStop(0, prop['chart.border.color1']);
702
- grad.addColorStop(0.5, prop['chart.border.color2']);
703
- grad.addColorStop(1, prop['chart.border.color3']);
704
-
705
-
706
- co.beginPath();
707
- co.fillStyle = grad;
708
- co.strokeStyle = 'rgba(0,0,0,0)'
709
- co.lineWidth = 0.001;
710
- co.arc(this.centerx, this.centery, this.radius + 20, 0, RG.TWOPI, 0);
711
- co.arc(this.centerx, this.centery, this.radius - 2, RG.TWOPI, 0, 1);
712
- co.fill();
713
- }
714
-
715
- // Put the linewidth back to what it was
716
- co.lineWidth = prop['chart.linewidth'];
717
-
718
-
719
- /**
720
- * Draw the title if specified
721
- */
722
- if (prop['chart.title']) {
723
- RG.DrawTitle(this,
724
- prop['chart.title'],
725
- this.centery - this.radius,
726
- null,
727
- prop['chart.title.size'] ? prop['chart.title.size'] : prop['chart.text.size'] + 2);
728
- }
729
-
730
-
731
- // Draw the big tick marks
732
- if (!prop['chart.tickmarks.highlighted']) {
733
- for (var i=18; i<=360; i+=36) {
734
- co.beginPath();
735
- co.strokeStyle = prop['chart.tickmarks.big.color'];
736
- co.lineWidth = 2;
737
- co.arc(this.centerx, this.centery, this.radius - 1, RG.degrees2Radians(i), RG.degrees2Radians(i+0.01), false);
738
- co.arc(this.centerx, this.centery, this.radius - 7, RG.degrees2Radians(i), RG.degrees2Radians(i+0.01), false);
739
- co.stroke();
740
- }
741
- }
742
- };
743
-
744
-
745
-
746
-
747
- /**
748
- * Draws the needle of the odometer
749
- *
750
- * @param number value The value to represent
751
- * @param string color The color of the needle
752
- * @param number The OPTIONAL length of the needle
753
- */
754
- this.drawNeedle =
755
- this.DrawNeedle = function (value, color)
756
- {
757
- // The optional length of the needle
758
- var length = arguments[2] ? arguments[2] : this.radius - prop['chart.label.area'];
759
-
760
- // ===== First draw a grey background circle =====
761
-
762
- co.fillStyle = '#999';
763
-
764
- co.beginPath();
765
- co.moveTo(this.centerx, this.centery);
766
- co.arc(this.centerx, this.centery, 10, 0, RG.TWOPI, false);
767
- co.fill();
768
- co.closePath();
769
-
770
- co.fill();
771
-
772
- // ===============================================
773
-
774
- co.fillStyle = color
775
- co.strokeStyle = '#666';
776
-
777
- // Draw the centre bit
778
- co.beginPath();
779
- co.moveTo(this.centerx, this.centery);
780
- co.arc(this.centerx, this.centery, 8, 0, RG.TWOPI, false);
781
- co.fill();
782
- co.closePath();
783
-
784
- co.stroke();
785
- co.fill();
786
-
787
- if (prop['chart.needle.type'] == 'pointer') {
788
-
789
- co.strokeStyle = color;
790
- co.lineWidth = prop['chart.needle.width'];
791
- co.lineCap = 'round';
792
- co.lineJoin = 'round';
793
-
794
- // Draw the needle
795
- co.beginPath();
796
- // The trailing bit on the opposite side of the dial
797
- co.beginPath();
798
- co.moveTo(this.centerx, this.centery);
799
-
800
- if (prop['chart.needle.tail']) {
801
-
802
- co.arc(this.centerx,
803
- this.centery,
804
- 20,
805
- (((value / this.range) * 360) + 90) / (180 / RG.PI),
806
- (((value / this.range) * 360) + 90 + 0.01) / (180 / RG.PI), // The 0.01 avoids a bug in ExCanvas and Chrome 6
807
- false
808
- );
809
- }
810
-
811
- // Draw the long bit on the opposite side
812
- co.arc(this.centerx,
813
- this.centery,
814
- length - 10,
815
- (((value / this.range) * 360) - 90) / (180 / RG.PI),
816
- (((value / this.range) * 360) - 90 + 0.1 ) / (180 / RG.PI), // The 0.1 avoids a bug in ExCanvas and Chrome 6
817
- false
818
- );
819
- co.closePath();
820
-
821
- //co.stroke();
822
- //co.fill();
823
-
824
-
825
- } else if (prop['chart.needle.type'] == 'triangle') {
826
-
827
- co.lineWidth = 0.01;
828
- co.lineEnd = 'square';
829
- co.lineJoin = 'miter';
830
-
831
- /**
832
- * This draws the version of the pointer that becomes the border
833
- */
834
- co.beginPath();
835
- co.fillStyle = prop['chart.needle.triangle.border'];
836
- co.arc(this.centerx, this.centery, 11, (((value / this.range) * 360)) / 57.3, ((((value / this.range) * 360)) + 0.01) / 57.3, 0);
837
- co.arc(this.centerx, this.centery, 11, (((value / this.range) * 360) + 180) / 57.3, ((((value / this.range) * 360) + 180) + 0.01)/ 57.3, 0);
838
- co.arc(this.centerx, this.centery, length - 5, (((value / this.range) * 360) - 90) / 57.3, ((((value / this.range) * 360) - 90) / 57.3) + 0.01, 0);
839
- co.closePath();
840
- co.fill();
841
-
842
- co.beginPath();
843
- co.arc(this.centerx, this.centery, 15, 0, RG.TWOPI, 0);
844
- co.closePath();
845
- co.fill();
846
-
847
- // This draws the pointer
848
- co.beginPath();
849
- co.strokeStyle = 'black';
850
- co.fillStyle = color;
851
- co.arc(this.centerx, this.centery, 7, (((value / this.range) * 360)) / 57.3, ((((value / this.range) * 360)) + 0.01) / 57.3, 0);
852
- co.arc(this.centerx, this.centery, 7, (((value / this.range) * 360) + 180) / 57.3, ((((value / this.range) * 360) + 180) + 0.01)/ 57.3, 0);
853
- co.arc(this.centerx, this.centery, length - 13, (((value / this.range) * 360) - 90) / 57.3, ((((value / this.range) * 360) - 90) / 57.3) + 0.01, 0);
854
- co.closePath();
855
- co.stroke();
856
- co.fill();
857
-
858
-
859
- /**
860
- * This is here to accomodate the MSIE/ExCanvas combo
861
- */
862
- co.beginPath();
863
- co.arc(this.centerx, this.centery, 7, 0, RG.TWOPI, 0);
864
- co.closePath();
865
- co.fill();
866
- }
867
-
868
-
869
- co.stroke();
870
- co.fill();
871
-
872
- // Draw the mini center circle
873
- co.beginPath();
874
- co.fillStyle = color;
875
- co.arc(this.centerx, this.centery, prop['chart.needle.type'] == 'pointer' ? 7 : 12, 0.01, RG.TWOPI, false);
876
- co.fill();
877
-
878
- // This draws the arrow at the end of the line
879
- if (prop['chart.needle.head'] && prop['chart.needle.type'] == 'pointer') {
880
- co.lineWidth = 1;
881
- co.fillStyle = color;
882
-
883
- // round, bevel, miter
884
- co.lineJoin = 'miter';
885
- co.lineCap = 'butt';
886
-
887
- co.beginPath();
888
- co.arc(this.centerx, this.centery, length - 5, (((value / this.range) * 360) - 90) / 57.3, (((value / this.range) * 360) - 90 + 0.1) / 57.3, false);
889
-
890
- co.arc(this.centerx,
891
- this.centery,
892
- length - 20,
893
- RG.degrees2Radians( ((value / this.range) * 360) - (length < 60 ? 80 : 85) ),
894
- RG.degrees2Radians( ((value / this.range) * 360) - (length < 60 ? 100 : 95) ),
895
- 1);
896
- co.closePath();
897
-
898
- co.fill();
899
- //co.stroke();
900
- }
901
-
902
-
903
- /**
904
- * Draw a white circle at the centre
905
- */
906
- co.beginPath();
907
- co.fillStyle = 'gray';
908
- co.moveTo(this.centerx, this.centery);
909
- co.arc(this.centerx,this.centery,2,0,6.2795,false);
910
- co.closePath();
911
-
912
- co.fill();
913
- };
914
-
915
-
916
-
917
-
918
- /**
919
- * Draws the labels for the Odo
920
- */
921
- this.drawLabels =
922
- this.DrawLabels = function ()
923
- {
924
- var size = prop['chart.text.size'];
925
- var font = prop['chart.text.font'];
926
- var centerx = this.centerx;
927
- var centery = this.centery;
928
- var r = this.radius - (prop['chart.label.area'] / 2);
929
- var start = this.min;
930
- var end = this.max;
931
- var decimals = prop['chart.scale.decimals'];
932
- var labels = prop['chart.labels'];
933
- var units_pre = prop['chart.units.pre'];
934
- var units_post = prop['chart.units.post'];
935
-
936
- co.beginPath();
937
- co.fillStyle = prop['chart.text.color'];
938
-
939
- /**
940
- * If labels are specified, use those
941
- */
942
- if (labels) {
943
- for (var i=0; i<labels.length; ++i) {
944
-
945
- RG.Text2(this, {'font':font,
946
- 'size':size,
947
- 'x':centerx + (Math.cos(((i / labels.length) * RG.TWOPI) - RG.HALFPI) * (this.radius - (prop['chart.label.area'] / 2) ) ), // Sin A = Opp / Hyp
948
- 'y':centery + (Math.sin(((i / labels.length) * RG.TWOPI) - RG.HALFPI) * (this.radius - (prop['chart.label.area'] / 2) ) ), // Cos A = Adj / Hyp
949
- 'text': String(labels[i]),
950
- 'valign':'center',
951
- 'halign':'center',
952
- 'tag': 'labels'
953
- });
954
- }
955
-
956
- /**
957
- * If not, use the maximum value
958
- */
959
- } else {
960
- RG.Text2(this, {'font':font,'size':size,'x':centerx + (0.588 * r ),'y':centery - (0.809 * r ),'text':RG.number_format(this, (((end - start) * (1/10)) + start).toFixed(decimals), units_pre, units_post),'halign':'center','valign':'center','angle':36,'tag': 'scale'});
961
- RG.Text2(this, {'font':font,'size':size,'x':centerx + (0.951 * r ),'y':centery - (0.309 * r),'text':RG.number_format(this, (((end - start) * (2/10)) + start).toFixed(decimals), units_pre, units_post),'halign':'center','valign':'center','angle':72,'tag': 'scale'});
962
- RG.Text2(this, {'font':font,'size':size,'x':centerx + (0.949 * r),'y':centery + (0.31 * r),'text':RG.number_format(this, (((end - start) * (3/10)) + start).toFixed(decimals), units_pre, units_post),'halign':'center','valign':'center','angle':108,'tag': 'scale'});
963
- RG.Text2(this, {'font':font,'size':size,'x':centerx + (0.588 * r ),'y':centery + (0.809 * r ),'text':RG.number_format(this, (((end - start) * (4/10)) + start).toFixed(decimals), units_pre, units_post),'halign':'center','valign':'center','angle':144,'tag': 'scale'});
964
- RG.Text2(this, {'font':font,'size':size,'x':centerx,'y':centery + r,'text':RG.number_format(this, (((end - start) * (5/10)) + start).toFixed(decimals),units_pre, units_post),'halign':'center','valign':'center','angle':180,'tag': 'scale'});
965
-
966
- RG.Text2(this, {'font':font,'size':size,'x':centerx - (0.588 * r ),'y':centery + (0.809 * r ),'text':RG.number_format(this, (((end - start) * (6/10)) + start).toFixed(decimals), units_pre, units_post),'halign':'center','valign':'center','angle':216,'tag': 'scale'});
967
- RG.Text2(this, {'font':font,'size':size,'x':centerx - (0.949 * r),'y':centery + (0.300 * r),'text':RG.number_format(this, (((end - start) * (7/10)) + start).toFixed(decimals), units_pre, units_post),'halign':'center','valign':'center','angle':252,'tag': 'scale'});
968
- RG.Text2(this, {'font':font,'size':size,'x':centerx - (0.951 * r),'y':centery - (0.309 * r),'text':RG.number_format(this, (((end - start) * (8/10)) + start).toFixed(decimals), units_pre, units_post),'halign':'center','valign':'center','angle':288,'tag': 'scale'});
969
- RG.Text2(this, {'font':font,'size':size,'x':centerx - (0.588 * r ),'y':centery - (0.809 * r ),'text':RG.number_format(this, (((end - start) * (9/10)) + start).toFixed(decimals), units_pre, units_post),'halign':'center','valign':'center','angle':324,'tag': 'scale'});
970
- RG.Text2(this, {'font':font,'size':size,'x':centerx,'y':centery - r,'text': prop['chart.zerostart'] ? RG.number_format(this, this.min.toFixed(decimals), units_pre, units_post) : RG.number_format(this, (((end - start) * (10/10)) + start).toFixed(decimals), units_pre, units_post),'halign':'center','valign':'center','tag': 'scale'});
971
- }
972
-
973
- co.fill();
974
-
975
- /**
976
- * Draw the text label below the center point
977
- */
978
- if (prop['chart.value.text']) {
979
- co.strokeStyle = 'black';
980
- RG.Text2(this, {'font':font,
981
- 'size':size+2,
982
- 'x':centerx,
983
- 'y':centery + size + 15,
984
- 'text':String(prop['chart.value.units.pre'] + this.value.toFixed(prop['chart.value.text.decimals']) + prop['chart.value.units.post']),
985
- 'halign':'center',
986
- 'valign':'center',
987
- 'bounding':true,
988
- 'boundingFill':'white',
989
- 'tag': 'value.text'
990
- });
991
- }
992
- };
993
-
994
-
995
-
996
-
997
- /**
998
- * A placeholder function
999
- *
1000
- * @param object The event object
1001
- */
1002
- this.getShape = function (e) {};
1003
-
1004
-
1005
-
1006
-
1007
- /**
1008
- * This function returns the pertinent value at the point of click
1009
- *
1010
- * @param object The event object
1011
- */
1012
- this.getValue = function (e)
1013
- {
1014
- var mouseXY = RG.getMouseXY(e)
1015
- var angle = RG.getAngleByXY(this.centerx, this.centery, mouseXY[0], mouseXY[1]);
1016
- angle += RG.HALFPI;
1017
-
1018
- if (mouseXY[0] >= this.centerx && mouseXY[1] <= this.centery) {
1019
- angle -= RG.TWOPI;
1020
- }
1021
-
1022
- var value = ((angle / RG.TWOPI) * (this.max - this.min)) + this.min;
1023
-
1024
- return value;
1025
- };
1026
-
1027
-
1028
-
1029
-
1030
- /**
1031
- * The getObjectByXY() worker method. Don't call this call:
1032
- *
1033
- * RGraph.ObjectRegistry.getObjectByXY(e)
1034
- *
1035
- * @param object e The event object
1036
- */
1037
- this.getObjectByXY = function (e)
1038
- {
1039
- var mouseXY = RG.getMouseXY(e);
1040
- var radius = RG.getHypLength(this.centerx, this.centery, mouseXY[0], mouseXY[1]);
1041
-
1042
- if (
1043
- mouseXY[0] > (this.centerx - this.radius)
1044
- && mouseXY[0] < (this.centerx + this.radius)
1045
- && mouseXY[1] > (this.centery - this.radius)
1046
- && mouseXY[1] < (this.centery + this.radius)
1047
- && radius <= this.radius
1048
- ) {
1049
-
1050
- return this;
1051
- }
1052
- };
1053
-
1054
-
1055
-
1056
-
1057
- /**
1058
- * This method handles the adjusting calculation for when the mouse is moved
1059
- *
1060
- * @param object e The event object
1061
- */
1062
- this.adjusting_mousemove =
1063
- this.Adjusting_mousemove = function (e)
1064
- {
1065
- /**
1066
- * Handle adjusting for the Bar
1067
- */
1068
- if (prop['chart.adjustable'] && RG.Registry.Get('chart.adjusting') && RG.Registry.Get('chart.adjusting').uid == this.uid) {
1069
- this.value = this.getValue(e);
1070
- RG.clear(ca);
1071
- RG.redrawCanvas(ca);
1072
- RG.fireCustomEvent(this, 'onadjust');
1073
- }
1074
- };
1075
-
1076
-
1077
-
1078
-
1079
- /**
1080
- * This method returns the appropriate angle for a value
1081
- *
1082
- * @param number value The value
1083
- */
1084
- this.getAngle = function (value)
1085
- {
1086
- // Higher than max or lower than min
1087
- if (value > this.max || value < this.min) {
1088
- return null;
1089
- }
1090
-
1091
- var angle = (((value - this.min) / (this.max - this.min)) * RG.TWOPI);
1092
- angle -= RG.HALFPI;
1093
-
1094
- return angle;
1095
- };
1096
-
1097
-
1098
-
1099
-
1100
- /**
1101
- * This allows for easy specification of gradients
1102
- */
1103
- this.parseColors = function ()
1104
- {
1105
- // Save the original colors so that they can be restored when the canvas is reset
1106
- if (this.original_colors.length === 0) {
1107
- this.original_colors['chart.green.color'] = RG.array_clone(prop['chart.green.color']);
1108
- this.original_colors['chart.yellow.color'] = RG.array_clone(prop['chart.yellow.color']);
1109
- this.original_colors['chart.red.color'] = RG.array_clone(prop['chart.red.color']);
1110
- }
1111
-
1112
- // Parse the basic colors
1113
- prop['chart.green.color'] = this.parseSingleColorForGradient(prop['chart.green.color']);
1114
- prop['chart.yellow.color'] = this.parseSingleColorForGradient(prop['chart.yellow.color']);
1115
- prop['chart.red.color'] = this.parseSingleColorForGradient(prop['chart.red.color']);
1116
- };
1117
-
1118
-
1119
-
1120
-
1121
- /**
1122
- * Use this function to reset the object to the post-constructor state. Eg reset colors if
1123
- * need be etc
1124
- */
1125
- this.reset = function ()
1126
- {
1127
- };
1128
-
1129
-
1130
-
1131
-
1132
- /**
1133
- * This parses a single color value
1134
- */
1135
- this.parseSingleColorForGradient = function (color)
1136
- {
1137
- if (!color || typeof(color) != 'string') {
1138
- return color;
1139
- }
1140
-
1141
- if (color.match(/^gradient\((.*)\)$/i)) {
1142
-
1143
- var parts = RegExp.$1.split(':');
1144
-
1145
- // Create the gradient
1146
- var grad = co.createRadialGradient(this.centerx, this.centery, 0, this.centerx, this.centery, this.radius);
1147
-
1148
- var diff = 1 / (parts.length - 1);
1149
-
1150
- grad.addColorStop(0, RG.trim(parts[0]));
1151
-
1152
- for (var j=1; j<parts.length; ++j) {
1153
- grad.addColorStop(j * diff, RG.trim(parts[j]));
1154
- }
1155
- }
1156
-
1157
- return grad ? grad : color;
1158
- };
1159
-
1160
-
1161
-
1162
-
1163
- /**
1164
- * Using a function to add events makes it easier to facilitate method chaining
1165
- *
1166
- * @param string type The type of even to add
1167
- * @param function func
1168
- */
1169
- this.on = function (type, func)
1170
- {
1171
- if (type.substr(0,2) !== 'on') {
1172
- type = 'on' + type;
1173
- }
1174
-
1175
- if (typeof this[type] !== 'function') {
1176
- this[type] = func;
1177
- } else {
1178
- RG.addCustomEventListener(this, type, func);
1179
- }
1180
-
1181
- return this;
1182
- };
1183
-
1184
-
1185
-
1186
-
1187
- /**
1188
- * This function runs once only
1189
- * (put at the end of the file (before any effects))
1190
- */
1191
- this.firstDrawFunc = function ()
1192
- {
1193
- };
1194
-
1195
-
1196
-
1197
-
1198
- /**
1199
- * Odo Grow
1200
- *
1201
- * This effect gradually increases the represented value
1202
- *
1203
- * @param An object of effect properties - eg: {frames: 30}
1204
- * @param function An optional callback function
1205
- */
1206
- this.grow = function ()
1207
- {
1208
- var obj = this;
1209
- var opt = arguments[0] || {};
1210
- var frames = opt.frames || 30;
1211
- var frame = 0;
1212
- var current = obj.currentValue || 0;
1213
- var origValue = Number(obj.currentValue);
1214
- var newValue = obj.value;
1215
- var diff = newValue - origValue;
1216
- var step = (diff / frames);
1217
- var callback = arguments[1] || function () {};
1218
-
1219
-
1220
-
1221
- function iterator ()
1222
- {
1223
- obj.value = origValue + (frame * step);
1224
-
1225
- RG.clear(obj.canvas);
1226
- RG.redrawCanvas(obj.canvas);
1227
-
1228
- if (frame++ < frames) {
1229
- RG.Effects.updateCanvas(iterator);
1230
- } else {
1231
- callback(obj);
1232
- }
1233
- }
1234
-
1235
- iterator();
1236
-
1237
- return this;
1238
- };
1239
-
1240
-
1241
-
1242
-
1243
-
1244
-
1245
- RG.att(ca);
1246
-
1247
-
1248
-
1249
-
1250
- /**
1251
- * Register the object
1252
- */
1253
- RG.register(this);
1254
-
1255
-
1256
-
1257
-
1258
- /**
1259
- * This is the 'end' of the constructor so if the first argument
1260
- * contains configuration data - handle that.
1261
- */
1262
- if (parseConfObjectForOptions) {
1263
- RG.parseObjectStyleConfig(this, conf.options);
1264
- }
1265
- };
2
+ RGraph=window.RGraph||{isRGraph:true};RGraph.Odometer=function(conf)
3
+ {if(typeof conf==='object'&&typeof conf.value!=='undefined'&&typeof conf.id==='string'){var id=conf.id
4
+ var canvas=document.getElementById(id);var min=conf.min;var max=conf.max;var value=conf.value;var parseConfObjectForOptions=true;}else{var id=conf;var canvas=document.getElementById(id);var min=arguments[1];var max=arguments[2];var value=arguments[3];}
5
+ this.id=id;this.canvas=canvas;this.context=this.canvas.getContext?this.canvas.getContext("2d",{alpha:(typeof id==='object'&&id.alpha===false)?false:true}):null;this.canvas.__object__=this;this.type='odo';this.isRGraph=true;this.min=RGraph.stringsToNumbers(min);this.max=RGraph.stringsToNumbers(max);this.value=RGraph.stringsToNumbers(value);this.currentValue=null;this.uid=RGraph.CreateUID();this.canvas.uid=this.canvas.uid?this.canvas.uid:RGraph.CreateUID();this.colorsParsed=false;this.coordsText=[];this.original_colors=[];this.firstDraw=true;this.properties={'chart.background.border':'black','chart.background.color':'#eee','chart.background.lines.color':'#ddd','chart.centerx':null,'chart.centery':null,'chart.radius':null,'chart.value.text':false,'chart.value.text.decimals':0,'chart.needle.color':'black','chart.needle.width':2,'chart.needle.head':true,'chart.needle.tail':true,'chart.needle.type':'pointer','chart.needle.extra':[],'chart.needle.triangle.border':'#aaa','chart.text.size':12,'chart.text.color':'black','chart.text.font':'Segoe UI, Arial, Verdana, sans-serif','chart.text.accessible':false,'chart.text.accessible.overflow':'visible','chart.text.accessible.pointerevents':true,'chart.green.max':max*0.75,'chart.red.min':max*0.9,'chart.green.color':'Gradient(white:#0c0)','chart.yellow.color':'Gradient(white:#ff0)','chart.red.color':'Gradient(white:#f00)','chart.label.area':35,'chart.gutter.left':25,'chart.gutter.right':25,'chart.gutter.top':25,'chart.gutter.bottom':25,'chart.title':'','chart.title.background':null,'chart.title.hpos':null,'chart.title.vpos':null,'chart.title.font':null,'chart.title.bold':true,'chart.title.x':null,'chart.title.y':null,'chart.title.halign':null,'chart.title.valign':null,'chart.contextmenu':null,'chart.linewidth':1,'chart.shadow.inner':false,'chart.shadow.inner.color':'black','chart.shadow.inner.offsetx':3,'chart.shadow.inner.offsety':3,'chart.shadow.inner.blur':6,'chart.shadow.outer':false,'chart.shadow.outer.color':'black','chart.shadow.outer.offsetx':3,'chart.shadow.outer.offsety':3,'chart.shadow.outer.blur':6,'chart.annotatable':false,'chart.annotate.color':'black','chart.scale.decimals':0,'chart.scale.point':'.','chart.scale.thousand':',','chart.zoom.factor':1.5,'chart.zoom.fade.in':true,'chart.zoom.fade.out':true,'chart.zoom.hdir':'right','chart.zoom.vdir':'down','chart.zoom.frames':25,'chart.zoom.delay':16.666,'chart.zoom.shadow':true,'chart.zoom.background':true,'chart.zoom.action':'zoom','chart.resizable':false,'chart.resize.handle.adjust':[0,0],'chart.resize.handle.background':null,'chart.units.pre':'','chart.units.post':'','chart.border':false,'chart.border.color1':'#BEBCB0','chart.border.color2':'#F0EFEA','chart.border.color3':'#BEBCB0','chart.tickmarks':true,'chart.tickmarks.highlighted':false,'chart.tickmarks.big.color':'#999','chart.zerostart':false,'chart.labels':null,'chart.units.pre':'','chart.units.post':'','chart.value.units.pre':'','chart.value.units.post':'','chart.key':null,'chart.key.background':'white','chart.key.position':'graph','chart.key.shadow':false,'chart.key.shadow.color':'#666','chart.key.shadow.blur':3,'chart.key.shadow.offsetx':2,'chart.key.shadow.offsety':2,'chart.key.position.gutter.boxed':false,'chart.key.position.x':null,'chart.key.position.y':null,'chart.key.halign':'right','chart.key.color.shape':'square','chart.key.rounded':true,'chart.key.text.size':10,'chart.key.colors':null,'chart.key.text.color':'black','chart.adjustable':false,'chart.clearto':'rgba(0,0,0,0)'}
6
+ 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,value)
10
+ {var value=arguments[1]||null;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
+ if(name=='chart.needle.style'){alert('[RGRAPH] The RGraph property chart.needle.style has changed to chart.needle.color');}
14
+ if(name=='chart.needle.thickness'){name='chart.needle.width';}
15
+ if(name=='chart.value'){this.value=value;return;}
16
+ prop[name]=value;return this;};this.get=this.Get=function(name)
17
+ {if(name.substr(0,6)!='chart.'){name='chart.'+name;}
18
+ while(name.match(/([A-Z])/)){name=name.replace(/([A-Z])/,'.'+RegExp.$1.toLowerCase());}
19
+ if(name=='chart.value'){return this.value;}
20
+ return prop[name.toLowerCase()];};this.draw=this.Draw=function()
21
+ {RG.FireCustomEvent(this,'onbeforedraw');this.currentValue=this.value;if(this.value>this.max){this.value=this.max;}
22
+ if(this.value<this.min){this.value=this.min;}
23
+ this.gutterLeft=prop['chart.gutter.left'];this.gutterRight=prop['chart.gutter.right'];this.gutterTop=prop['chart.gutter.top'];this.gutterBottom=prop['chart.gutter.bottom'];this.radius=Math.min((ca.width-this.gutterLeft-this.gutterRight)/2,(ca.height-this.gutterTop-this.gutterBottom)/2)
24
+ -(prop['chart.border']?25:0);this.diameter=2*this.radius;this.centerx=((ca.width-this.gutterLeft-this.gutterRight)/2)+this.gutterLeft;this.centery=((ca.height-this.gutterTop-this.gutterBottom)/2)+this.gutterTop;this.range=this.max-this.min;this.coordsText=[];if(prop['chart.key']&&prop['chart.key'].length>0&&ca.width>ca.height)this.centerx=5+this.radius;if(typeof(prop['chart.centerx'])=='number')this.centerx=prop['chart.centerx'];if(typeof(prop['chart.centery'])=='number')this.centery=prop['chart.centery'];if(typeof(prop['chart.radius'])=='number'){this.radius=prop['chart.radius'];if(prop['chart.border']){this.radius-=25;}}
25
+ if(!this.colorsParsed){this.parseColors();this.colorsParsed=true;}
26
+ co.lineWidth=prop['chart.linewidth'];this.DrawBackground();this.DrawLabels();this.DrawNeedle(this.value,prop['chart.needle.color']);if(prop['chart.needle.extra'].length>0){for(var i=0;i<prop['chart.needle.extra'].length;++i){var needle=prop['chart.needle.extra'][i];this.DrawNeedle(needle[0],needle[1],needle[2]);}}
27
+ if(prop['chart.key']&&prop['chart.key'].length>0){var colors=[prop['chart.needle.color']];if(prop['chart.needle.extra'].length>0){for(var i=0;i<prop['chart.needle.extra'].length;++i){var needle=prop['chart.needle.extra'][i];colors.push(needle[1]);}}
28
+ RG.DrawKey(this,prop['chart.key'],colors);}
29
+ if(prop['chart.contextmenu']){RG.ShowContext(this);}
30
+ if(prop['chart.resizable']){RG.AllowResizing(this);}
31
+ RG.InstallEventListeners(this);if(this.firstDraw){this.firstDraw=false;RG.fireCustomEvent(this,'onfirstdraw');this.firstDrawFunc();}
32
+ RG.FireCustomEvent(this,'ondraw');return this;};this.exec=function(func)
33
+ {func(this);return this;};this.drawBackground=this.DrawBackground=function()
34
+ {co.beginPath();if(prop['chart.shadow.outer']){RG.setShadow(this,prop['chart.shadow.outer.color'],prop['chart.shadow.outer.offsetx'],prop['chart.shadow.outer.offsety'],prop['chart.shadow.outer.blur']);}
35
+ var backgroundColor=prop['chart.background.color'];co.fillStyle=backgroundColor;co.arc(this.centerx,this.centery,this.radius,0.0001,RG.TWOPI,false);co.fill();RG.noShadow(this);co.strokeStyle='#666';co.arc(this.centerx,this.centery,this.radius,0,RG.TWOPI,false);co.fillStyle=backgroundColor;co.arc(this.centerx,this.centery,this.radius,0,RG.TWOPI,false);co.fill();if(prop['chart.tickmarks']){co.beginPath();co.strokeStyle='#bbb';for(var i=0;i<=360;i+=3){co.arc(this.centerx,this.centery,this.radius,0,i/57.3,false);co.lineTo(this.centerx,this.centery);}
36
+ co.stroke();}
37
+ co.beginPath();co.lineWidth=1;co.strokeStyle='black';co.fillStyle=backgroundColor;co.strokeStyle=backgroundColor;co.arc(this.centerx,this.centery,this.radius-5,0,RG.TWOPI,false);co.fill();co.stroke();co.beginPath();co.strokeStyle=prop['chart.background.lines.color'];for(var i=0;i<360;i+=18){co.arc(this.centerx,this.centery,this.radius,0,RG.degrees2Radians(i),false);co.lineTo(this.centerx,this.centery);}
38
+ co.stroke();co.beginPath();co.strokeStyle=prop['chart.background.border'];co.arc(this.centerx,this.centery,this.radius,0,RG.TWOPI,false);co.stroke();if(prop['chart.shadow.inner']){co.beginPath();RG.SetShadow(this,prop['chart.shadow.inner.color'],prop['chart.shadow.inner.offsetx'],prop['chart.shadow.inner.offsety'],prop['chart.shadow.inner.blur']);co.arc(this.centerx,this.centery,this.radius-prop['chart.label.area'],0,RG.TWOPI,0);co.fill();co.stroke();RG.NoShadow(this);}
39
+ var greengrad=prop['chart.green.color'];if(prop['chart.tickmarks.highlighted']){co.beginPath();co.lineWidth=5;co.strokeStyle=greengrad;co.arc(this.centerx,this.centery,this.radius-2.5,-1*RG.HALFPI,(((prop['chart.green.max']-this.min)/(this.max-this.min))*RG.TWOPI)-RG.HALFPI,0);co.stroke();co.lineWidth=1;}
40
+ co.beginPath();co.fillStyle=greengrad;co.arc(this.centerx,this.centery,this.radius-prop['chart.label.area'],0-RG.HALFPI,(((prop['chart.green.max']-this.min)/(this.max-this.min))*RG.TWOPI)-RG.HALFPI,false);co.lineTo(this.centerx,this.centery);co.closePath();co.fill();var yellowgrad=prop['chart.yellow.color'];if(prop['chart.tickmarks.highlighted']){co.beginPath();co.lineWidth=5;co.strokeStyle=yellowgrad;co.arc(this.centerx,this.centery,this.radius-2.5,(((prop['chart.green.max']-this.min)/(this.max-this.min))*RG.TWOPI)-RG.HALFPI,(((prop['chart.red.min']-this.min)/(this.max-this.min))*RG.TWOPI)-RG.HALFPI,0);co.stroke();co.lineWidth=1;}
41
+ co.beginPath();co.fillStyle=yellowgrad;co.arc(this.centerx,this.centery,this.radius-prop['chart.label.area'],(((prop['chart.green.max']-this.min)/(this.max-this.min))*RG.TWOPI)-RG.HALFPI,(((prop['chart.red.min']-this.min)/(this.max-this.min))*RG.TWOPI)-RG.HALFPI,false);co.lineTo(this.centerx,this.centery);co.closePath();co.fill();var redgrad=prop['chart.red.color'];if(prop['chart.tickmarks.highlighted']){co.beginPath();co.lineWidth=5;co.strokeStyle=redgrad;co.arc(this.centerx,this.centery,this.radius-2.5,(((prop['chart.red.min']-this.min)/(this.max-this.min))*RG.TWOPI)-RG.HALFPI,RG.TWOPI-RG.HALFPI,0);co.stroke();co.lineWidth=1;}
42
+ co.beginPath();co.fillStyle=redgrad;co.strokeStyle=redgrad;co.arc(this.centerx,this.centery,this.radius-prop['chart.label.area'],(((prop['chart.red.min']-this.min)/(this.max-this.min))*RG.TWOPI)-RG.HALFPI,RG.TWOPI-RG.HALFPI,false);co.lineTo(this.centerx,this.centery);co.closePath();co.fill();if(prop['chart.border']){var grad=co.createRadialGradient(this.centerx,this.centery,this.radius,this.centerx,this.centery,this.radius+20);grad.addColorStop(0,prop['chart.border.color1']);grad.addColorStop(0.5,prop['chart.border.color2']);grad.addColorStop(1,prop['chart.border.color3']);co.beginPath();co.fillStyle=grad;co.strokeStyle='rgba(0,0,0,0)'
43
+ co.lineWidth=0.001;co.arc(this.centerx,this.centery,this.radius+20,0,RG.TWOPI,0);co.arc(this.centerx,this.centery,this.radius-2,RG.TWOPI,0,1);co.fill();}
44
+ co.lineWidth=prop['chart.linewidth'];if(prop['chart.title']){RG.DrawTitle(this,prop['chart.title'],this.centery-this.radius,null,prop['chart.title.size']?prop['chart.title.size']:prop['chart.text.size']+2);}
45
+ if(!prop['chart.tickmarks.highlighted']){for(var i=18;i<=360;i+=36){co.beginPath();co.strokeStyle=prop['chart.tickmarks.big.color'];co.lineWidth=2;co.arc(this.centerx,this.centery,this.radius-1,RG.degrees2Radians(i),RG.degrees2Radians(i+0.01),false);co.arc(this.centerx,this.centery,this.radius-7,RG.degrees2Radians(i),RG.degrees2Radians(i+0.01),false);co.stroke();}}};this.drawNeedle=this.DrawNeedle=function(value,color)
46
+ {var length=arguments[2]?arguments[2]:this.radius-prop['chart.label.area'];co.fillStyle='#999';co.beginPath();co.moveTo(this.centerx,this.centery);co.arc(this.centerx,this.centery,10,0,RG.TWOPI,false);co.fill();co.closePath();co.fill();co.fillStyle=color
47
+ co.strokeStyle='#666';co.beginPath();co.moveTo(this.centerx,this.centery);co.arc(this.centerx,this.centery,8,0,RG.TWOPI,false);co.fill();co.closePath();co.stroke();co.fill();if(prop['chart.needle.type']=='pointer'){co.strokeStyle=color;co.lineWidth=prop['chart.needle.width'];co.lineCap='round';co.lineJoin='round';co.beginPath();co.beginPath();co.moveTo(this.centerx,this.centery);if(prop['chart.needle.tail']){co.arc(this.centerx,this.centery,20,(((value/this.range)*360)+90)/(180/RG.PI),(((value/this.range)*360)+90+0.01)/(180/RG.PI),false);}
48
+ co.arc(this.centerx,this.centery,length-10,(((value/this.range)*360)-90)/(180/RG.PI),(((value/this.range)*360)-90+0.1)/(180/RG.PI),false);co.closePath();}else if(prop['chart.needle.type']=='triangle'){co.lineWidth=0.01;co.lineEnd='square';co.lineJoin='miter';co.beginPath();co.fillStyle=prop['chart.needle.triangle.border'];co.arc(this.centerx,this.centery,11,(((value/this.range)*360))/57.3,((((value/this.range)*360))+0.01)/57.3,0);co.arc(this.centerx,this.centery,11,(((value/this.range)*360)+180)/57.3,((((value/this.range)*360)+180)+0.01)/57.3,0);co.arc(this.centerx,this.centery,length-5,(((value/this.range)*360)-90)/57.3,((((value/this.range)*360)-90)/57.3)+0.01,0);co.closePath();co.fill();co.beginPath();co.arc(this.centerx,this.centery,15,0,RG.TWOPI,0);co.closePath();co.fill();co.beginPath();co.strokeStyle='black';co.fillStyle=color;co.arc(this.centerx,this.centery,7,(((value/this.range)*360))/57.3,((((value/this.range)*360))+0.01)/57.3,0);co.arc(this.centerx,this.centery,7,(((value/this.range)*360)+180)/57.3,((((value/this.range)*360)+180)+0.01)/57.3,0);co.arc(this.centerx,this.centery,length-13,(((value/this.range)*360)-90)/57.3,((((value/this.range)*360)-90)/57.3)+0.01,0);co.closePath();co.stroke();co.fill();co.beginPath();co.arc(this.centerx,this.centery,7,0,RG.TWOPI,0);co.closePath();co.fill();}
49
+ co.stroke();co.fill();co.beginPath();co.fillStyle=color;co.arc(this.centerx,this.centery,prop['chart.needle.type']=='pointer'?7:12,0.01,RG.TWOPI,false);co.fill();if(prop['chart.needle.head']&&prop['chart.needle.type']=='pointer'){co.lineWidth=1;co.fillStyle=color;co.lineJoin='miter';co.lineCap='butt';co.beginPath();co.arc(this.centerx,this.centery,length-5,(((value/this.range)*360)-90)/57.3,(((value/this.range)*360)-90+0.1)/57.3,false);co.arc(this.centerx,this.centery,length-20,RG.degrees2Radians(((value/this.range)*360)-(length<60?80:85)),RG.degrees2Radians(((value/this.range)*360)-(length<60?100:95)),1);co.closePath();co.fill();}
50
+ co.beginPath();co.fillStyle='gray';co.moveTo(this.centerx,this.centery);co.arc(this.centerx,this.centery,2,0,6.2795,false);co.closePath();co.fill();};this.drawLabels=this.DrawLabels=function()
51
+ {var size=prop['chart.text.size'];var font=prop['chart.text.font'];var centerx=this.centerx;var centery=this.centery;var r=this.radius-(prop['chart.label.area']/2);var start=this.min;var end=this.max;var decimals=prop['chart.scale.decimals'];var labels=prop['chart.labels'];var units_pre=prop['chart.units.pre'];var units_post=prop['chart.units.post'];co.beginPath();co.fillStyle=prop['chart.text.color'];if(labels){for(var i=0;i<labels.length;++i){RG.Text2(this,{'font':font,'size':size,'x':centerx+(Math.cos(((i/labels.length)*RG.TWOPI)-RG.HALFPI)*(this.radius-(prop['chart.label.area']/2))),'y':centery+(Math.sin(((i/labels.length)*RG.TWOPI)-RG.HALFPI)*(this.radius-(prop['chart.label.area']/2))),'text':String(labels[i]),'valign':'center','halign':'center','tag':'labels'});}}else{RG.Text2(this,{'font':font,'size':size,'x':centerx+(0.588*r),'y':centery-(0.809*r),'text':RG.number_format(this,(((end-start)*(1/10))+start).toFixed(decimals),units_pre,units_post),'halign':'center','valign':'center','angle':36,'tag':'scale'});RG.Text2(this,{'font':font,'size':size,'x':centerx+(0.951*r),'y':centery-(0.309*r),'text':RG.number_format(this,(((end-start)*(2/10))+start).toFixed(decimals),units_pre,units_post),'halign':'center','valign':'center','angle':72,'tag':'scale'});RG.Text2(this,{'font':font,'size':size,'x':centerx+(0.949*r),'y':centery+(0.31*r),'text':RG.number_format(this,(((end-start)*(3/10))+start).toFixed(decimals),units_pre,units_post),'halign':'center','valign':'center','angle':108,'tag':'scale'});RG.Text2(this,{'font':font,'size':size,'x':centerx+(0.588*r),'y':centery+(0.809*r),'text':RG.number_format(this,(((end-start)*(4/10))+start).toFixed(decimals),units_pre,units_post),'halign':'center','valign':'center','angle':144,'tag':'scale'});RG.Text2(this,{'font':font,'size':size,'x':centerx,'y':centery+r,'text':RG.number_format(this,(((end-start)*(5/10))+start).toFixed(decimals),units_pre,units_post),'halign':'center','valign':'center','angle':180,'tag':'scale'});RG.Text2(this,{'font':font,'size':size,'x':centerx-(0.588*r),'y':centery+(0.809*r),'text':RG.number_format(this,(((end-start)*(6/10))+start).toFixed(decimals),units_pre,units_post),'halign':'center','valign':'center','angle':216,'tag':'scale'});RG.Text2(this,{'font':font,'size':size,'x':centerx-(0.949*r),'y':centery+(0.300*r),'text':RG.number_format(this,(((end-start)*(7/10))+start).toFixed(decimals),units_pre,units_post),'halign':'center','valign':'center','angle':252,'tag':'scale'});RG.Text2(this,{'font':font,'size':size,'x':centerx-(0.951*r),'y':centery-(0.309*r),'text':RG.number_format(this,(((end-start)*(8/10))+start).toFixed(decimals),units_pre,units_post),'halign':'center','valign':'center','angle':288,'tag':'scale'});RG.Text2(this,{'font':font,'size':size,'x':centerx-(0.588*r),'y':centery-(0.809*r),'text':RG.number_format(this,(((end-start)*(9/10))+start).toFixed(decimals),units_pre,units_post),'halign':'center','valign':'center','angle':324,'tag':'scale'});RG.Text2(this,{'font':font,'size':size,'x':centerx,'y':centery-r,'text':prop['chart.zerostart']?RG.number_format(this,this.min.toFixed(decimals),units_pre,units_post):RG.number_format(this,(((end-start)*(10/10))+start).toFixed(decimals),units_pre,units_post),'halign':'center','valign':'center','tag':'scale'});}
52
+ co.fill();if(prop['chart.value.text']){co.strokeStyle='black';RG.Text2(this,{'font':font,'size':size+2,'x':centerx,'y':centery+size+15,'text':String(prop['chart.value.units.pre']+this.value.toFixed(prop['chart.value.text.decimals'])+prop['chart.value.units.post']),'halign':'center','valign':'center','bounding':true,'boundingFill':'white','tag':'value.text'});}};this.getShape=function(e){};this.getValue=function(e)
53
+ {var mouseXY=RG.getMouseXY(e)
54
+ var angle=RG.getAngleByXY(this.centerx,this.centery,mouseXY[0],mouseXY[1]);angle+=RG.HALFPI;if(mouseXY[0]>=this.centerx&&mouseXY[1]<=this.centery){angle-=RG.TWOPI;}
55
+ var value=((angle/RG.TWOPI)*(this.max-this.min))+this.min;return value;};this.getObjectByXY=function(e)
56
+ {var mouseXY=RG.getMouseXY(e);var radius=RG.getHypLength(this.centerx,this.centery,mouseXY[0],mouseXY[1]);if(mouseXY[0]>(this.centerx-this.radius)&&mouseXY[0]<(this.centerx+this.radius)&&mouseXY[1]>(this.centery-this.radius)&&mouseXY[1]<(this.centery+this.radius)&&radius<=this.radius){return this;}};this.adjusting_mousemove=this.Adjusting_mousemove=function(e)
57
+ {if(prop['chart.adjustable']&&RG.Registry.Get('chart.adjusting')&&RG.Registry.Get('chart.adjusting').uid==this.uid){this.value=this.getValue(e);RG.clear(ca);RG.redrawCanvas(ca);RG.fireCustomEvent(this,'onadjust');}};this.getAngle=function(value)
58
+ {if(value>this.max||value<this.min){return null;}
59
+ var angle=(((value-this.min)/(this.max-this.min))*RG.TWOPI);angle-=RG.HALFPI;return angle;};this.parseColors=function()
60
+ {if(this.original_colors.length===0){this.original_colors['chart.green.color']=RG.array_clone(prop['chart.green.color']);this.original_colors['chart.yellow.color']=RG.array_clone(prop['chart.yellow.color']);this.original_colors['chart.red.color']=RG.array_clone(prop['chart.red.color']);}
61
+ prop['chart.green.color']=this.parseSingleColorForGradient(prop['chart.green.color']);prop['chart.yellow.color']=this.parseSingleColorForGradient(prop['chart.yellow.color']);prop['chart.red.color']=this.parseSingleColorForGradient(prop['chart.red.color']);};this.reset=function()
62
+ {};this.parseSingleColorForGradient=function(color)
63
+ {if(!color||typeof(color)!='string'){return color;}
64
+ if(color.match(/^gradient\((.*)\)$/i)){var parts=RegExp.$1.split(':');var grad=co.createRadialGradient(this.centerx,this.centery,0,this.centerx,this.centery,this.radius);var 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]));}}
65
+ return grad?grad:color;};this.on=function(type,func)
66
+ {if(type.substr(0,2)!=='on'){type='on'+type;}
67
+ if(typeof this[type]!=='function'){this[type]=func;}else{RG.addCustomEventListener(this,type,func);}
68
+ return this;};this.firstDrawFunc=function()
69
+ {};this.grow=function()
70
+ {var obj=this;var opt=arguments[0]||{};var frames=opt.frames||30;var frame=0;var current=obj.currentValue||0;var origValue=Number(obj.currentValue);var newValue=obj.value;var diff=newValue-origValue;var step=(diff/frames);var callback=arguments[1]||function(){};function iterator()
71
+ {obj.value=origValue+(frame*step);RG.clear(obj.canvas);RG.redrawCanvas(obj.canvas);if(frame++<frames){RG.Effects.updateCanvas(iterator);}else{callback(obj);}}
72
+ iterator();return this;};RG.att(ca);RG.register(this);if(parseConfObjectForOptions){RG.parseObjectStyleConfig(this,conf.options);}};