source: Dev/trunk/RGraph/libraries/RGraph.common.tooltips.js @ 77

Last change on this file since 77 was 77, checked in by fpvanagthoven, 14 years ago

RGraph

File size: 36.2 KB
Line 
1    /**
2    * o------------------------------------------------------------------------------o
3    * | This file is part of the RGraph package - you can learn more at:             |
4    * |                                                                              |
5    * |                          http://www.rgraph.net                               |
6    * |                                                                              |
7    * | This package is licensed under the RGraph license. For all kinds of business |
8    * | purposes there is a small one-time licensing fee to pay and for non          |
9    * | commercial  purposes it is free to use. You can read the full license here:  |
10    * |                                                                              |
11    * |                      http://www.rgraph.net/LICENSE.txt                       |
12    * o------------------------------------------------------------------------------o
13    */
14
15    if (typeof(RGraph) == 'undefined') RGraph = {isRGraph:true,type:'common'};
16   
17    /**
18    * This is used in two functions, hence it's here
19    */
20    RGraph.tooltips = {};
21    RGraph.tooltips.padding   = '3px';
22    RGraph.tooltips.font_face = 'Tahoma';
23    RGraph.tooltips.font_size = '10pt';
24
25
26    /**
27    * Shows a tooltip next to the mouse pointer
28    *
29    * @param canvas object The canvas element object
30    * @param text   string The tooltip text
31    * @param int     x      The X position that the tooltip should appear at. Combined with the canvases offsetLeft
32    *                       gives the absolute X position
33    * @param int     y      The Y position the tooltip should appear at. Combined with the canvases offsetTop
34    *                       gives the absolute Y position
35    * @param int     idx    The index of the tooltip in the graph objects tooltip array
36    */
37    RGraph.Tooltip = function (canvas, text, x, y, idx)
38    {
39        /**
40        * chart.tooltip.override allows you to totally take control of rendering the tooltip yourself
41        */
42        if (typeof(canvas.__object__.Get('chart.tooltips.override')) == 'function') {
43            return canvas.__object__.Get('chart.tooltips.override')(canvas, text, x, y, idx);
44        }
45
46        /**
47        * This facilitates the "id:xxx" format
48        */
49        text = RGraph.getTooltipText(text);
50
51        /**
52        * First clear any exising timers
53        */
54        var timers = RGraph.Registry.Get('chart.tooltip.timers');
55
56        if (timers && timers.length) {
57            for (i=0; i<timers.length; ++i) {
58                clearTimeout(timers[i]);
59            }
60        }
61        RGraph.Registry.Set('chart.tooltip.timers', []);
62
63        /**
64        * Hide the context menu if it's currently shown
65        */
66        if (canvas.__object__.Get('chart.contextmenu')) {
67            RGraph.HideContext();
68        }
69        // Redraw the canvas?
70        if (canvas.__object__.Get('chart.tooltips.highlight')) {
71            RGraph.Redraw(canvas.id);
72        }
73
74        var effect = canvas.__object__.Get('chart.tooltips.effect').toLowerCase();
75
76        if (effect == 'snap' && RGraph.Registry.Get('chart.tooltip') && RGraph.Registry.Get('chart.tooltip').__canvas__.id == canvas.id) {
77
78            if (   canvas.__object__.type == 'line'
79                || canvas.__object__.type == 'radar'
80                || canvas.__object__.type == 'scatter'
81                || canvas.__object__.type == 'rscatter'
82                ) {
83
84                var tooltipObj = RGraph.Registry.Get('chart.tooltip');
85               
86       
87                tooltipObj.style.width  = null;
88                tooltipObj.style.height = null;
89       
90                tooltipObj.innerHTML = text;
91                tooltipObj.__text__  = text;
92       
93                /**
94                * Now that the new content has been set, re-set the width & height
95                */
96                RGraph.Registry.Get('chart.tooltip').style.width  = RGraph.getTooltipWidth(text, canvas.__object__) + 'px';
97                RGraph.Registry.Get('chart.tooltip').style.height = RGraph.Registry.Get('chart.tooltip').offsetHeight + 'px';
98               
99           
100                var currentx = parseInt(RGraph.Registry.Get('chart.tooltip').style.left);
101                var currenty = parseInt(RGraph.Registry.Get('chart.tooltip').style.top);
102           
103                var diffx = x - currentx - ((x + RGraph.Registry.Get('chart.tooltip').offsetWidth) > document.body.offsetWidth ? RGraph.Registry.Get('chart.tooltip').offsetWidth : 0);
104                var diffy = y - currenty - RGraph.Registry.Get('chart.tooltip').offsetHeight;
105           
106                // Position the tooltip
107                setTimeout('RGraph.Registry.Get("chart.tooltip").style.left = "' + (currentx + (diffx * 0.2)) + 'px"', 25);
108                setTimeout('RGraph.Registry.Get("chart.tooltip").style.left = "' + (currentx + (diffx * 0.4)) + 'px"', 50);
109                setTimeout('RGraph.Registry.Get("chart.tooltip").style.left = "' + (currentx + (diffx * 0.6)) + 'px"', 75);
110                setTimeout('RGraph.Registry.Get("chart.tooltip").style.left = "' + (currentx + (diffx * 0.8)) + 'px"', 100);
111                setTimeout('RGraph.Registry.Get("chart.tooltip").style.left = "' + (currentx + (diffx * 1.0)) + 'px"', 125);
112           
113                setTimeout('RGraph.Registry.Get("chart.tooltip").style.top = "' + (currenty + (diffy * 0.2)) + 'px"', 25);
114                setTimeout('RGraph.Registry.Get("chart.tooltip").style.top = "' + (currenty + (diffy * 0.4)) + 'px"', 50);
115                setTimeout('RGraph.Registry.Get("chart.tooltip").style.top = "' + (currenty + (diffy * 0.6)) + 'px"', 75);
116                setTimeout('RGraph.Registry.Get("chart.tooltip").style.top = "' + (currenty + (diffy * 0.8)) + 'px"', 100);
117                setTimeout('RGraph.Registry.Get("chart.tooltip").style.top = "' + (currenty + (diffy * 1.0)) + 'px"', 125);
118           
119            } else {
120       
121                alert('[TOOLTIPS] The "snap" effect is only supported on the Line, Rscatter, Scatter and Radar charts (tried to use it with type: ' + canvas.__object__.type);
122            }
123
124            /**
125            * Fire the tooltip event
126            */
127            RGraph.FireCustomEvent(canvas.__object__, 'ontooltip');
128
129            return;
130        }
131
132        /**
133        * Hide any currently shown tooltip
134        */
135        RGraph.HideTooltip();
136
137
138        /**
139        * Show a tool tip
140        */
141        var tooltipObj  = document.createElement('DIV');
142        tooltipObj.className             = canvas.__object__.Get('chart.tooltips.css.class');
143        tooltipObj.style.display         = 'none';
144        tooltipObj.style.position        = 'absolute';
145        tooltipObj.style.left            = 0;
146        tooltipObj.style.top             = 0;
147        tooltipObj.style.backgroundColor = 'rgba(255,255,239,0.9)';
148        tooltipObj.style.color           = 'black';
149        if (!document.all) tooltipObj.style.border = '';
150        tooltipObj.style.visibility      = 'visible';
151        tooltipObj.style.paddingLeft     = RGraph.tooltips.padding;
152        tooltipObj.style.paddingRight    = RGraph.tooltips.padding;
153        tooltipObj.style.fontFamily      = RGraph.tooltips.font_face;
154        tooltipObj.style.fontSize        = RGraph.tooltips.font_size;
155        tooltipObj.style.zIndex          = 3;
156        tooltipObj.style.borderRadius       = '5px';
157        tooltipObj.style.MozBorderRadius    = '5px';
158        tooltipObj.style.WebkitBorderRadius = '5px';
159        tooltipObj.style.WebkitBoxShadow    = 'rgba(96,96,96,0.5) 0 0 15px';
160        tooltipObj.style.MozBoxShadow       = 'rgba(96,96,96,0.5) 0 0 15px';
161        tooltipObj.style.boxShadow          = 'rgba(96,96,96,0.5) 0 0 15px';
162        tooltipObj.style.filter             = 'progid:DXImageTransform.Microsoft.Shadow(color=#666666,direction=135)';
163        tooltipObj.style.opacity            = 0;
164        tooltipObj.style.overflow           = 'hidden';
165        tooltipObj.innerHTML                = text;
166        tooltipObj.__text__                 = text; // This is set because the innerHTML can change when it's set
167        tooltipObj.__canvas__               = canvas;
168        tooltipObj.style.display            = 'inline';
169       
170        if (typeof(idx) == 'number') {
171            tooltipObj.__index__ = idx;
172           
173            /**
174            * Just for the line chart
175            */
176            if (canvas.__object__.type == 'line') {
177                var index2 = idx;
178               
179                while (index2 >= canvas.__object__.data[0].length) {
180                    index2 -= canvas.__object__.data[0].length;
181                }
182               
183                tooltipObj.__index2__ = index2;
184            }
185        }
186
187        document.body.appendChild(tooltipObj);
188       
189        var width  = tooltipObj.offsetWidth;
190        var height = tooltipObj.offsetHeight;
191
192        if ((y - height - 2) > 0) {
193            y = y - height - 2;
194        } else {
195            y = y + 2;
196        }
197
198        /**
199        * Set the width on the tooltip so it doesn't resize if the window is resized
200        */
201        tooltipObj.style.width = width + 'px';
202        //tooltipObj.style.height = 0; // Initially set the tooltip height to nothing
203
204        /**
205        * If the mouse is towards the right of the browser window and the tooltip would go outside of the window,
206        * move it left
207        */
208        if ( (x + width) > document.body.offsetWidth ) {
209            x = x - width - 7;
210            var placementLeft = true;
211           
212            if (canvas.__object__.Get('chart.tooltips.effect') == 'none') {
213                x = x - 3;
214            }
215
216            tooltipObj.style.left = x + 'px';
217            tooltipObj.style.top  = y + 'px';
218
219        } else {
220            x += 5;
221
222            tooltipObj.style.left = x + 'px';
223            tooltipObj.style.top = y + 'px';
224        }
225
226
227        if (effect == 'expand') {
228
229            tooltipObj.style.left        = (x + (width / 2)) + 'px';
230            tooltipObj.style.top         = (y + (height / 2)) + 'px';
231            leftDelta                    = (width / 2) / 10;
232            topDelta                     = (height / 2) / 10;
233
234            tooltipObj.style.width              = 0;
235            tooltipObj.style.height             = 0;
236            //tooltipObj.style.boxShadow          = '';
237            //tooltipObj.style.MozBoxShadow       = '';
238            //tooltipObj.style.WebkitBoxShadow    = '';
239            //tooltipObj.style.borderRadius       = 0;
240            //tooltipObj.style.MozBorderRadius    = 0;
241            //tooltipObj.style.WebkitBorderRadius = 0;
242            tooltipObj.style.opacity = 1;
243
244            // Progressively move the tooltip to where it should be (the x position)
245            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) - leftDelta) + 'px' }", 25));
246            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) - leftDelta) + 'px' }", 50));
247            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) - leftDelta) + 'px' }", 75));
248            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) - leftDelta) + 'px' }", 100));
249            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) - leftDelta) + 'px' }", 125));
250            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) - leftDelta) + 'px' }", 150));
251            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) - leftDelta) + 'px' }", 175));
252            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) - leftDelta) + 'px' }", 200));
253            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) - leftDelta) + 'px' }", 225));
254            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) - leftDelta) + 'px' }", 250));
255           
256            // Progressively move the tooltip to where it should be (the Y position)
257            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) - topDelta) + 'px' }", 25));
258            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) - topDelta) + 'px' }", 50));
259            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) - topDelta) + 'px' }", 75));
260            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) - topDelta) + 'px' }", 100));
261            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) - topDelta) + 'px' }", 125));
262            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) - topDelta) + 'px' }", 150));
263            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) - topDelta) + 'px' }", 175));
264            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) - topDelta) + 'px' }", 200));
265            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) - topDelta) + 'px' }", 225));
266            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) - topDelta) + 'px' }", 250));
267
268            // Progressively grow the tooltip width
269            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 0.1) + "px'; }", 25));
270            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 0.2) + "px'; }", 50));
271            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 0.3) + "px'; }", 75));
272            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 0.4) + "px'; }", 100));
273            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 0.5) + "px'; }", 125));
274            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 0.6) + "px'; }", 150));
275            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 0.7) + "px'; }", 175));
276            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 0.8) + "px'; }", 200));
277            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 0.9) + "px'; }", 225));
278            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + width + "px'; }", 250));
279
280            // Progressively grow the tooltip height
281            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 0.1) + "px'; }", 25));
282            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 0.2) + "px'; }", 50));
283            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 0.3) + "px'; }", 75));
284            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 0.4) + "px'; }", 100));
285            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 0.5) + "px'; }", 125));
286            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 0.6) + "px'; }", 150));
287            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 0.7) + "px'; }", 175));
288            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 0.8) + "px'; }", 200));
289            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 0.9) + "px'; }", 225));
290            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + height + "px'; }", 250));
291           
292            // When the animation is finished, set the tooltip HTML
293            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').innerHTML = RGraph.Registry.Get('chart.tooltip').__text__; }", 250));
294       
295        } else if (effect == 'contract') {
296
297            tooltipObj.style.left = (x - width) + 'px';
298            tooltipObj.style.top  = (y - (height * 2)) + 'px';
299            tooltipObj.style.cursor = 'pointer';
300
301            leftDelta = width / 10;
302            topDelta  = height / 10;
303
304            tooltipObj.style.width  = (width * 5) + 'px';
305            tooltipObj.style.height = (height * 5) + 'px';
306
307            tooltipObj.style.opacity = 0.2;
308
309            // Progressively move the tooltip to where it should be (the x position)
310            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) + leftDelta) + 'px' }", 25));
311            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) + leftDelta) + 'px' }", 50));
312            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) + leftDelta) + 'px' }", 75));
313            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) + leftDelta) + 'px' }", 100));
314            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) + leftDelta) + 'px' }", 125));
315            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) + leftDelta) + 'px' }", 150));
316            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) + leftDelta) + 'px' }", 175));
317            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) + leftDelta) + 'px' }", 200));
318            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) + leftDelta) + 'px' }", 225));
319            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = (parseInt(RGraph.Registry.Get('chart.tooltip').style.left) + leftDelta) + 'px' }", 250));
320
321            // Progressively move the tooltip to where it should be (the Y position)
322            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) + (topDelta*2)) + 'px' }", 25));
323            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) + (topDelta*2)) + 'px' }", 50));
324            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) + (topDelta*2)) + 'px' }", 75));
325            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) + (topDelta*2)) + 'px' }", 100));
326            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) + (topDelta*2)) + 'px' }", 125));
327            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) + (topDelta*2)) + 'px' }", 150));
328            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) + (topDelta*2)) + 'px' }", 175));
329            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) + (topDelta*2)) + 'px' }", 200));
330            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) + (topDelta*2)) + 'px' }", 225));
331            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = (parseInt(RGraph.Registry.Get('chart.tooltip').style.top) + (topDelta*2)) + 'px' }", 250));
332
333            // Progressively shrink the tooltip width
334            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 5.5) + "px'; }", 25));
335            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 5.0) + "px'; }", 50));
336            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 4.5) + "px'; }", 75));
337            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 4.0) + "px'; }", 100));
338            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 3.5) + "px'; }", 125));
339            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 3.0) + "px'; }", 150));
340            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 2.5) + "px'; }", 175));
341            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 2.0) + "px'; }", 200));
342            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + (width * 1.5) + "px'; }", 225));
343            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.width = '" + width + "px'; }", 250));
344
345            // Progressively shrink the tooltip height
346            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 5.5) + "px'; }", 25));
347            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 5.0) + "px'; }", 50));
348            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 4.5) + "px'; }", 75));
349            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 4.0) + "px'; }", 100));
350            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 3.5) + "px'; }", 125));
351            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 3.0) + "px'; }", 150));
352            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 2.5) + "px'; }", 175));
353            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 2.0) + "px'; }", 200));
354            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + (height * 1.5) + "px'; }", 225));
355            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.height = '" + height + "px'; }", 250));
356
357            // When the animation is finished, set the tooltip HTML
358            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').innerHTML = RGraph.Registry.Get('chart.tooltip').__text__; }", 250));
359
360            /**
361            * This resets the pointer
362            */
363            RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.cursor = 'default'; }", 275));
364
365        } else if (effect == 'snap') {
366
367            /*******************************************************
368            * Move the tooltip
369            *******************************************************/
370            for (var i=1; i<=10; ++i) {
371                RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.left = '" + (x * 0.1 * i) + "px'; }", 15 * i));
372                RGraph.Registry.Get('chart.tooltip.timers').push(setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.top = '" + (y * 0.1 * i) + "px'; }", 15 * i));
373            }
374
375            tooltipObj.style.left = 0 - tooltipObj.offsetWidth + 'px';
376            tooltipObj.style.top  = 0 - tooltipObj.offsetHeight + 'px';
377
378        } else if (effect != 'fade' && effect != 'expand' && effect != 'none' && effect != 'snap' && effect != 'contract') {
379            alert('[COMMON] Unknown tooltip effect: ' + effect);
380        }
381
382        if (effect != 'none') {
383            setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.opacity = 0.1; }", 25);
384            setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.opacity = 0.2; }", 50);
385            setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.opacity = 0.3; }", 75);
386            setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.opacity = 0.4; }", 100);
387            setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.opacity = 0.5; }", 125);
388            setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.opacity = 0.6; }", 150);
389            setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.opacity = 0.7; }", 175);
390            setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.opacity = 0.8; }", 200);
391            setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.opacity = 0.9; }", 225);
392        }
393
394        setTimeout("if (RGraph.Registry.Get('chart.tooltip')) { RGraph.Registry.Get('chart.tooltip').style.opacity = 1;}", effect == 'none' ? 50 : 250);
395
396        /**
397        * If the tooltip it self is clicked, cancel it
398        */
399        tooltipObj.onmousedown = function (e)
400        {
401            e = RGraph.FixEventObject(e)
402            e.stopPropagation();
403        }
404       
405        tooltipObj.onclick = function (e)
406        {
407            if (e.button == 0) {
408                e = RGraph.FixEventObject(e);
409                e.stopPropagation();
410            }
411        }
412
413        /**
414        * Install the function for hiding the tooltip.
415        */
416        document.body.onmousedown = function (event)
417        {
418            var tooltip = RGraph.Registry.Get('chart.tooltip');
419
420            if (tooltip) {
421                RGraph.HideTooltip();
422
423                // Redraw if highlighting is enabled
424                if (tooltip.__canvas__.__object__.Get('chart.tooltips.highlight')) {
425                    RGraph.Redraw();
426                }
427            }
428        }
429
430        /**
431        * If the window is resized, hide the tooltip
432        */
433        window.onresize = function ()
434        {
435            var tooltip = RGraph.Registry.Get('chart.tooltip');
436
437            if (tooltip) {
438                tooltip.parentNode.removeChild(tooltip);
439                tooltip.style.display = 'none';               
440                tooltip.style.visibility = 'hidden';
441                RGraph.Registry.Set('chart.tooltip', null);
442
443                // Redraw the graph if necessary
444                if (canvas.__object__.Get('chart.tooltips.highlight')) {
445                    RGraph.Clear(canvas);
446                    canvas.__object__.Draw();
447                }
448            }
449        }
450       
451        /**
452        * Keep a reference to the tooltip
453        */
454        RGraph.Registry.Set('chart.tooltip', tooltipObj);
455
456        /**
457        * Fire the tooltip event
458        */
459        RGraph.FireCustomEvent(canvas.__object__, 'ontooltip');
460    }
461   
462   
463    /**
464    *
465    */
466    RGraph.getTooltipText = function (text)
467    {
468        var result = /^id:(.*)/.exec(text);
469
470        if (result && result[1] && document.getElementById(result[1])) {
471            text = document.getElementById(result[1]).innerHTML;
472        }
473       
474        return text;
475    }
476
477
478    /**
479    *
480    */
481    RGraph.getTooltipWidth = function (text, obj)
482    {
483        var div = document.createElement('DIV');
484            div.className             = obj.Get('chart.tooltips.css.class');
485            div.style.paddingLeft     = RGraph.tooltips.padding;
486            div.style.paddingRight    = RGraph.tooltips.padding;
487            div.style.fontFamily      = RGraph.tooltips.font_face;
488            div.style.fontSize        = RGraph.tooltips.font_size;
489            div.style.visibility      = 'hidden';
490            div.style.position        = 'absolute';
491            div.style.top            = '300px';
492            div.style.left             = 0;
493            div.style.display         = 'inline';
494            div.innerHTML             = RGraph.getTooltipText(text);
495        document.body.appendChild(div);
496
497        return div.offsetWidth;
498    }
499
500
501    /**
502    * Hides the currently shown tooltip
503    */
504    RGraph.HideTooltip = function ()
505    {
506        var tooltip = RGraph.Registry.Get('chart.tooltip');
507
508        if (tooltip) {
509            tooltip.parentNode.removeChild(tooltip);
510            tooltip.style.display = 'none';               
511            tooltip.style.visibility = 'hidden';
512            RGraph.Registry.Set('chart.tooltip', null);
513        }
514    }
Note: See TracBrowser for help on using the repository browser.