1 | /** |
---|
2 | * jqPlot |
---|
3 | * Pure JavaScript plotting plugin using jQuery |
---|
4 | * |
---|
5 | * Version: 1.0.0b2_r1012 |
---|
6 | * |
---|
7 | * Copyright (c) 2009-2011 Chris Leonello |
---|
8 | * jqPlot is currently available for use in all personal or commercial projects |
---|
9 | * under both the MIT (http://www.opensource.org/licenses/mit-license.php) and GPL |
---|
10 | * version 2.0 (http://www.gnu.org/licenses/gpl-2.0.html) licenses. This means that you can |
---|
11 | * choose the license that best suits your project and use it accordingly. |
---|
12 | * |
---|
13 | * Although not required, the author would appreciate an email letting him |
---|
14 | * know of any substantial use of jqPlot. You can reach the author at: |
---|
15 | * chris at jqplot dot com or see http://www.jqplot.com/info.php . |
---|
16 | * |
---|
17 | * If you are feeling kind and generous, consider supporting the project by |
---|
18 | * making a donation at: http://www.jqplot.com/donate.php . |
---|
19 | * |
---|
20 | * sprintf functions contained in jqplot.sprintf.js by Ash Searle: |
---|
21 | * |
---|
22 | * version 2007.04.27 |
---|
23 | * author Ash Searle |
---|
24 | * http://hexmen.com/blog/2007/03/printf-sprintf/ |
---|
25 | * http://hexmen.com/js/sprintf.js |
---|
26 | * The author (Ash Searle) has placed this code in the public domain: |
---|
27 | * "This code is unrestricted: you are free to use it however you like." |
---|
28 | * |
---|
29 | */ |
---|
30 | (function($) { |
---|
31 | /** |
---|
32 | * Class: $.jqplot.CanvasAxisTickRenderer |
---|
33 | * Renderer to draw axis ticks with a canvas element to support advanced |
---|
34 | * featrues such as rotated text. This renderer uses a separate rendering engine |
---|
35 | * to draw the text on the canvas. Two modes of rendering the text are available. |
---|
36 | * If the browser has native font support for canvas fonts (currently Mozila 3.5 |
---|
37 | * and Safari 4), you can enable text rendering with the canvas fillText method. |
---|
38 | * You do so by setting the "enableFontSupport" option to true. |
---|
39 | * |
---|
40 | * Browsers lacking native font support will have the text drawn on the canvas |
---|
41 | * using the Hershey font metrics. Even if the "enableFontSupport" option is true |
---|
42 | * non-supporting browsers will still render with the Hershey font. |
---|
43 | */ |
---|
44 | $.jqplot.CanvasAxisTickRenderer = function(options) { |
---|
45 | // Group: Properties |
---|
46 | |
---|
47 | // prop: mark |
---|
48 | // tick mark on the axis. One of 'inside', 'outside', 'cross', '' or null. |
---|
49 | this.mark = 'outside'; |
---|
50 | // prop: showMark |
---|
51 | // wether or not to show the mark on the axis. |
---|
52 | this.showMark = true; |
---|
53 | // prop: showGridline |
---|
54 | // wether or not to draw the gridline on the grid at this tick. |
---|
55 | this.showGridline = true; |
---|
56 | // prop: isMinorTick |
---|
57 | // if this is a minor tick. |
---|
58 | this.isMinorTick = false; |
---|
59 | // prop: angle |
---|
60 | // angle of text, measured clockwise from x axis. |
---|
61 | this.angle = 0; |
---|
62 | // prop: markSize |
---|
63 | // Length of the tick marks in pixels. For 'cross' style, length |
---|
64 | // will be stoked above and below axis, so total length will be twice this. |
---|
65 | this.markSize = 4; |
---|
66 | // prop: show |
---|
67 | // wether or not to show the tick (mark and label). |
---|
68 | this.show = true; |
---|
69 | // prop: showLabel |
---|
70 | // wether or not to show the label. |
---|
71 | this.showLabel = true; |
---|
72 | // prop: labelPosition |
---|
73 | // 'auto', 'start', 'middle' or 'end'. |
---|
74 | // Whether tick label should be positioned so the start, middle, or end |
---|
75 | // of the tick mark. |
---|
76 | this.labelPosition = 'auto'; |
---|
77 | this.label = ''; |
---|
78 | this.value = null; |
---|
79 | this._styles = {}; |
---|
80 | // prop: formatter |
---|
81 | // A class of a formatter for the tick text. |
---|
82 | // The default $.jqplot.DefaultTickFormatter uses sprintf. |
---|
83 | this.formatter = $.jqplot.DefaultTickFormatter; |
---|
84 | // prop: formatString |
---|
85 | // string passed to the formatter. |
---|
86 | this.formatString = ''; |
---|
87 | // prop: prefix |
---|
88 | // String to prepend to the tick label. |
---|
89 | // Prefix is prepended to the formatted tick label. |
---|
90 | this.prefix = ''; |
---|
91 | // prop: fontFamily |
---|
92 | // css spec for the font-family css attribute. |
---|
93 | this.fontFamily = '"Trebuchet MS", Arial, Helvetica, sans-serif'; |
---|
94 | // prop: fontSize |
---|
95 | // CSS spec for font size. |
---|
96 | this.fontSize = '10pt'; |
---|
97 | // prop: fontWeight |
---|
98 | // CSS spec for fontWeight |
---|
99 | this.fontWeight = 'normal'; |
---|
100 | // prop: fontStretch |
---|
101 | // Multiplier to condense or expand font width. |
---|
102 | // Applies only to browsers which don't support canvas native font rendering. |
---|
103 | this.fontStretch = 1.0; |
---|
104 | // prop: textColor |
---|
105 | // css spec for the color attribute. |
---|
106 | this.textColor = '#666666'; |
---|
107 | // prop: enableFontSupport |
---|
108 | // true to turn on native canvas font support in Mozilla 3.5+ and Safari 4+. |
---|
109 | // If true, tick label will be drawn with canvas tag native support for fonts. |
---|
110 | // If false, tick label will be drawn with Hershey font metrics. |
---|
111 | this.enableFontSupport = true; |
---|
112 | // prop: pt2px |
---|
113 | // Point to pixel scaling factor, used for computing height of bounding box |
---|
114 | // around a label. The labels text renderer has a default setting of 1.4, which |
---|
115 | // should be suitable for most fonts. Leave as null to use default. If tops of |
---|
116 | // letters appear clipped, increase this. If bounding box seems too big, decrease. |
---|
117 | // This is an issue only with the native font renderering capabilities of Mozilla |
---|
118 | // 3.5 and Safari 4 since they do not provide a method to determine the font height. |
---|
119 | this.pt2px = null; |
---|
120 | |
---|
121 | this._elem; |
---|
122 | this._ctx; |
---|
123 | this._plotWidth; |
---|
124 | this._plotHeight; |
---|
125 | this._plotDimensions = {height:null, width:null}; |
---|
126 | |
---|
127 | $.extend(true, this, options); |
---|
128 | |
---|
129 | var ropts = {fontSize:this.fontSize, fontWeight:this.fontWeight, fontStretch:this.fontStretch, fillStyle:this.textColor, angle:this.getAngleRad(), fontFamily:this.fontFamily}; |
---|
130 | if (this.pt2px) { |
---|
131 | ropts.pt2px = this.pt2px; |
---|
132 | } |
---|
133 | |
---|
134 | if (this.enableFontSupport) { |
---|
135 | if ($.jqplot.support_canvas_text()) { |
---|
136 | this._textRenderer = new $.jqplot.CanvasFontRenderer(ropts); |
---|
137 | } |
---|
138 | |
---|
139 | else { |
---|
140 | this._textRenderer = new $.jqplot.CanvasTextRenderer(ropts); |
---|
141 | } |
---|
142 | } |
---|
143 | else { |
---|
144 | this._textRenderer = new $.jqplot.CanvasTextRenderer(ropts); |
---|
145 | } |
---|
146 | }; |
---|
147 | |
---|
148 | $.jqplot.CanvasAxisTickRenderer.prototype.init = function(options) { |
---|
149 | $.extend(true, this, options); |
---|
150 | this._textRenderer.init({fontSize:this.fontSize, fontWeight:this.fontWeight, fontStretch:this.fontStretch, fillStyle:this.textColor, angle:this.getAngleRad(), fontFamily:this.fontFamily}); |
---|
151 | }; |
---|
152 | |
---|
153 | // return width along the x axis |
---|
154 | // will check first to see if an element exists. |
---|
155 | // if not, will return the computed text box width. |
---|
156 | $.jqplot.CanvasAxisTickRenderer.prototype.getWidth = function(ctx) { |
---|
157 | if (this._elem) { |
---|
158 | return this._elem.outerWidth(true); |
---|
159 | } |
---|
160 | else { |
---|
161 | var tr = this._textRenderer; |
---|
162 | var l = tr.getWidth(ctx); |
---|
163 | var h = tr.getHeight(ctx); |
---|
164 | var w = Math.abs(Math.sin(tr.angle)*h) + Math.abs(Math.cos(tr.angle)*l); |
---|
165 | return w; |
---|
166 | } |
---|
167 | }; |
---|
168 | |
---|
169 | // return height along the y axis. |
---|
170 | $.jqplot.CanvasAxisTickRenderer.prototype.getHeight = function(ctx) { |
---|
171 | if (this._elem) { |
---|
172 | return this._elem.outerHeight(true); |
---|
173 | } |
---|
174 | else { |
---|
175 | var tr = this._textRenderer; |
---|
176 | var l = tr.getWidth(ctx); |
---|
177 | var h = tr.getHeight(ctx); |
---|
178 | var w = Math.abs(Math.cos(tr.angle)*h) + Math.abs(Math.sin(tr.angle)*l); |
---|
179 | return w; |
---|
180 | } |
---|
181 | }; |
---|
182 | |
---|
183 | $.jqplot.CanvasAxisTickRenderer.prototype.getAngleRad = function() { |
---|
184 | var a = this.angle * Math.PI/180; |
---|
185 | return a; |
---|
186 | }; |
---|
187 | |
---|
188 | |
---|
189 | $.jqplot.CanvasAxisTickRenderer.prototype.setTick = function(value, axisName, isMinor) { |
---|
190 | this.value = value; |
---|
191 | if (isMinor) { |
---|
192 | this.isMinorTick = true; |
---|
193 | } |
---|
194 | return this; |
---|
195 | }; |
---|
196 | |
---|
197 | $.jqplot.CanvasAxisTickRenderer.prototype.draw = function(ctx, plot) { |
---|
198 | if (!this.label) { |
---|
199 | this.label = this.prefix + this.formatter(this.formatString, this.value); |
---|
200 | } |
---|
201 | |
---|
202 | // Memory Leaks patch |
---|
203 | if (this._elem) { |
---|
204 | if ($.jqplot.use_excanvas && window.G_vmlCanvasManager.uninitElement !== undefined) { |
---|
205 | window.G_vmlCanvasManager.uninitElement(this._elem.get(0)); |
---|
206 | } |
---|
207 | |
---|
208 | this._elem.emptyForce(); |
---|
209 | this._elem = null; |
---|
210 | } |
---|
211 | |
---|
212 | // create a canvas here, but can't draw on it untill it is appended |
---|
213 | // to dom for IE compatability. |
---|
214 | |
---|
215 | var elem = plot.canvasManager.getCanvas(); |
---|
216 | |
---|
217 | this._textRenderer.setText(this.label, ctx); |
---|
218 | var w = this.getWidth(ctx); |
---|
219 | var h = this.getHeight(ctx); |
---|
220 | // canvases seem to need to have width and heigh attributes directly set. |
---|
221 | elem.width = w; |
---|
222 | elem.height = h; |
---|
223 | elem.style.width = w; |
---|
224 | elem.style.height = h; |
---|
225 | elem.style.textAlign = 'left'; |
---|
226 | elem.style.position = 'absolute'; |
---|
227 | |
---|
228 | elem = plot.canvasManager.initCanvas(elem); |
---|
229 | |
---|
230 | this._elem = $(elem); |
---|
231 | this._elem.css(this._styles); |
---|
232 | this._elem.addClass('jqplot-'+this.axis+'-tick'); |
---|
233 | |
---|
234 | elem = null; |
---|
235 | return this._elem; |
---|
236 | }; |
---|
237 | |
---|
238 | $.jqplot.CanvasAxisTickRenderer.prototype.pack = function() { |
---|
239 | this._textRenderer.draw(this._elem.get(0).getContext("2d"), this.label); |
---|
240 | }; |
---|
241 | |
---|
242 | })(jQuery); |
---|