1 | /** |
---|
2 | * jqPlot |
---|
3 | * Pure JavaScript plotting plugin using jQuery |
---|
4 | * |
---|
5 | * Version: @VERSION |
---|
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.LogAxisRenderer |
---|
33 | * A plugin for a jqPlot to render a logarithmic axis. |
---|
34 | * |
---|
35 | * To use this renderer, include the plugin in your source |
---|
36 | * > <script type="text/javascript" language="javascript" src="plugins/jqplot.logAxisRenderer.js"></script> |
---|
37 | * |
---|
38 | * and supply the appropriate options to your plot |
---|
39 | * |
---|
40 | * > {axes:{xaxis:{renderer:$.jqplot.LogAxisRenderer}}} |
---|
41 | **/ |
---|
42 | $.jqplot.LogAxisRenderer = function() { |
---|
43 | $.jqplot.LinearAxisRenderer.call(this); |
---|
44 | // prop: axisDefaults |
---|
45 | // Default properties which will be applied directly to the series. |
---|
46 | // |
---|
47 | // Group: Properties |
---|
48 | // |
---|
49 | // Properties |
---|
50 | // |
---|
51 | /// base - the logarithmic base, commonly 2, 10 or Math.E |
---|
52 | // tickDistribution - 'even' or 'power'. 'even' gives equal pixel |
---|
53 | // spacing of the ticks on the plot. 'power' gives ticks in powers |
---|
54 | // of 10. |
---|
55 | this.axisDefaults = { |
---|
56 | base : 10, |
---|
57 | tickDistribution :'even' |
---|
58 | }; |
---|
59 | }; |
---|
60 | |
---|
61 | $.jqplot.LogAxisRenderer.prototype = new $.jqplot.LinearAxisRenderer(); |
---|
62 | $.jqplot.LogAxisRenderer.prototype.constructor = $.jqplot.LogAxisRenderer; |
---|
63 | |
---|
64 | $.jqplot.LogAxisRenderer.prototype.init = function(options) { |
---|
65 | // prop: tickRenderer |
---|
66 | // A class of a rendering engine for creating the ticks labels displayed on the plot, |
---|
67 | // See <$.jqplot.AxisTickRenderer>. |
---|
68 | // this.tickRenderer = $.jqplot.AxisTickRenderer; |
---|
69 | // this.labelRenderer = $.jqplot.AxisLabelRenderer; |
---|
70 | $.extend(true, this.renderer, options); |
---|
71 | for (var d in this.renderer.axisDefaults) { |
---|
72 | if (this[d] == null) { |
---|
73 | this[d] = this.renderer.axisDefaults[d]; |
---|
74 | } |
---|
75 | } |
---|
76 | var db = this._dataBounds; |
---|
77 | // Go through all the series attached to this axis and find |
---|
78 | // the min/max bounds for this axis. |
---|
79 | for (var i=0; i<this._series.length; i++) { |
---|
80 | var s = this._series[i]; |
---|
81 | var d = s.data; |
---|
82 | |
---|
83 | for (var j=0; j<d.length; j++) { |
---|
84 | if (this.name == 'xaxis' || this.name == 'x2axis') { |
---|
85 | if ((d[j][0] != null && d[j][0] < db.min) || db.min == null) { |
---|
86 | db.min = d[j][0]; |
---|
87 | } |
---|
88 | if ((d[j][0] != null && d[j][0] > db.max) || db.max == null) { |
---|
89 | db.max = d[j][0]; |
---|
90 | } |
---|
91 | } |
---|
92 | else { |
---|
93 | if ((d[j][1] != null && d[j][1] < db.min) || db.min == null) { |
---|
94 | db.min = d[j][1]; |
---|
95 | } |
---|
96 | if ((d[j][1] != null && d[j][1] > db.max) || db.max == null) { |
---|
97 | db.max = d[j][1]; |
---|
98 | } |
---|
99 | } |
---|
100 | } |
---|
101 | } |
---|
102 | }; |
---|
103 | |
---|
104 | $.jqplot.LogAxisRenderer.prototype.createTicks = function() { |
---|
105 | // we're are operating on an axis here |
---|
106 | var ticks = this._ticks; |
---|
107 | var userTicks = this.ticks; |
---|
108 | var name = this.name; |
---|
109 | var db = this._dataBounds; |
---|
110 | var dim, interval; |
---|
111 | var min, max; |
---|
112 | var pos1, pos2; |
---|
113 | var tt, i; |
---|
114 | |
---|
115 | // if we already have ticks, use them. |
---|
116 | // ticks must be in order of increasing value. |
---|
117 | if (userTicks.length) { |
---|
118 | // ticks could be 1D or 2D array of [val, val, ,,,] or [[val, label], [val, label], ...] or mixed |
---|
119 | for (i=0; i<userTicks.length; i++){ |
---|
120 | var ut = userTicks[i]; |
---|
121 | var t = new this.tickRenderer(this.tickOptions); |
---|
122 | if (ut.constructor == Array) { |
---|
123 | t.value = ut[0]; |
---|
124 | t.label = ut[1]; |
---|
125 | if (!this.showTicks) { |
---|
126 | t.showLabel = false; |
---|
127 | t.showMark = false; |
---|
128 | } |
---|
129 | else if (!this.showTickMarks) { |
---|
130 | t.showMark = false; |
---|
131 | } |
---|
132 | t.setTick(ut[0], this.name); |
---|
133 | this._ticks.push(t); |
---|
134 | } |
---|
135 | |
---|
136 | else { |
---|
137 | t.value = ut; |
---|
138 | if (!this.showTicks) { |
---|
139 | t.showLabel = false; |
---|
140 | t.showMark = false; |
---|
141 | } |
---|
142 | else if (!this.showTickMarks) { |
---|
143 | t.showMark = false; |
---|
144 | } |
---|
145 | t.setTick(ut, this.name); |
---|
146 | this._ticks.push(t); |
---|
147 | } |
---|
148 | } |
---|
149 | this.numberTicks = userTicks.length; |
---|
150 | this.min = this._ticks[0].value; |
---|
151 | this.max = this._ticks[this.numberTicks-1].value; |
---|
152 | } |
---|
153 | |
---|
154 | // we don't have any ticks yet, let's make some! |
---|
155 | else { |
---|
156 | if (name == 'xaxis' || name == 'x2axis') { |
---|
157 | dim = this._plotDimensions.width; |
---|
158 | } |
---|
159 | else { |
---|
160 | dim = this._plotDimensions.height; |
---|
161 | } |
---|
162 | |
---|
163 | min = ((this.min != null) ? this.min : db.min); |
---|
164 | max = ((this.max != null) ? this.max : db.max); |
---|
165 | |
---|
166 | // if min and max are same, space them out a bit |
---|
167 | if (min == max) { |
---|
168 | var adj = 0.05; |
---|
169 | min = min*(1-adj); |
---|
170 | max = max*(1+adj); |
---|
171 | } |
---|
172 | |
---|
173 | // perform some checks |
---|
174 | if (this.min != null && this.min <= 0) { |
---|
175 | throw('log axis minimum must be greater than 0'); |
---|
176 | } |
---|
177 | if (this.max != null && this.max <= 0) { |
---|
178 | throw('log axis maximum must be greater than 0'); |
---|
179 | } |
---|
180 | // if (this.pad >1.99) this.pad = 1.99; |
---|
181 | var range = max - min; |
---|
182 | var rmin, rmax; |
---|
183 | |
---|
184 | if (this.tickDistribution == 'even') { |
---|
185 | rmin = (this.min != null) ? this.min : min - min*((this.padMin-1)/2); |
---|
186 | rmax = (this.max != null) ? this.max : max + max*((this.padMax-1)/2); |
---|
187 | this.min = rmin; |
---|
188 | this.max = rmax; |
---|
189 | range = this.max - this.min; |
---|
190 | |
---|
191 | if (this.numberTicks == null){ |
---|
192 | if (dim > 100) { |
---|
193 | this.numberTicks = parseInt(3+(dim-100)/75, 10); |
---|
194 | } |
---|
195 | else { |
---|
196 | this.numberTicks = 2; |
---|
197 | } |
---|
198 | } |
---|
199 | |
---|
200 | var u = Math.pow(this.base, (1/(this.numberTicks-1)*Math.log(this.max/this.min)/Math.log(this.base))); |
---|
201 | for (var i=0; i<this.numberTicks; i++){ |
---|
202 | tt = this.min * Math.pow(u, i); |
---|
203 | var t = new this.tickRenderer(this.tickOptions); |
---|
204 | if (!this.showTicks) { |
---|
205 | t.showLabel = false; |
---|
206 | t.showMark = false; |
---|
207 | } |
---|
208 | else if (!this.showTickMarks) { |
---|
209 | t.showMark = false; |
---|
210 | } |
---|
211 | t.setTick(tt, this.name); |
---|
212 | this._ticks.push(t); |
---|
213 | } |
---|
214 | |
---|
215 | } |
---|
216 | |
---|
217 | else if (this.tickDistribution == 'power'){ |
---|
218 | // for power distribution, open up range to get a nice power of axis.renderer.base. |
---|
219 | // power distribution won't respect the user's min/max settings. |
---|
220 | rmin = Math.pow(this.base, Math.ceil(Math.log(min*(2-this.padMin))/Math.log(this.base))-1); |
---|
221 | rmax = Math.pow(this.base, Math.floor(Math.log(max*this.padMax)/Math.log(this.base))+1); |
---|
222 | this.min = rmin; |
---|
223 | this.max = rmax; |
---|
224 | range = this.max - this.min; |
---|
225 | |
---|
226 | var fittedTicks = 0; |
---|
227 | var minorTicks = 0; |
---|
228 | if (this.numberTicks == null){ |
---|
229 | if (dim > 100) { |
---|
230 | this.numberTicks = Math.round(Math.log(this.max/this.min)/Math.log(this.base) + 1); |
---|
231 | if (this.numberTicks < 2) { |
---|
232 | this.numberTicks = 2; |
---|
233 | } |
---|
234 | fittedTicks = parseInt(3+(dim-100)/75, 10); |
---|
235 | } |
---|
236 | else { |
---|
237 | this.numberTicks = 2; |
---|
238 | fittedTicks = 2; |
---|
239 | } |
---|
240 | // if we don't have enough ticks, add some intermediate ticks |
---|
241 | // how many to have between major ticks. |
---|
242 | if (this.numberTicks < fittedTicks-1) { |
---|
243 | minorTicks = Math.floor(fittedTicks/this.numberTicks); |
---|
244 | } |
---|
245 | } |
---|
246 | |
---|
247 | for (var i=0; i<this.numberTicks; i++){ |
---|
248 | tt = Math.pow(this.base, i - this.numberTicks + 1) * this.max; |
---|
249 | var t = new this.tickRenderer(this.tickOptions); |
---|
250 | if (!this.showTicks) { |
---|
251 | t.showLabel = false; |
---|
252 | t.showMark = false; |
---|
253 | } |
---|
254 | else if (!this.showTickMarks) { |
---|
255 | t.showMark = false; |
---|
256 | } |
---|
257 | t.setTick(tt, this.name); |
---|
258 | this._ticks.push(t); |
---|
259 | |
---|
260 | if (minorTicks && i<this.numberTicks-1) { |
---|
261 | var tt1 = Math.pow(this.base, i - this.numberTicks + 2) * this.max; |
---|
262 | var spread = tt1 - tt; |
---|
263 | var interval = tt1 / (minorTicks+1); |
---|
264 | for (var j=minorTicks-1; j>=0; j--) { |
---|
265 | var val = tt1-interval*(j+1); |
---|
266 | var t = new this.tickRenderer(this.tickOptions); |
---|
267 | if (!this.showTicks) { |
---|
268 | t.showLabel = false; |
---|
269 | t.showMark = false; |
---|
270 | } |
---|
271 | else if (!this.showTickMarks) { |
---|
272 | t.showMark = false; |
---|
273 | } |
---|
274 | t.setTick(val, this.name); |
---|
275 | this._ticks.push(t); |
---|
276 | } |
---|
277 | } |
---|
278 | } |
---|
279 | } |
---|
280 | } |
---|
281 | }; |
---|
282 | |
---|
283 | $.jqplot.LogAxisRenderer.prototype.pack = function(pos, offsets) { |
---|
284 | var lb = parseInt(this.base, 10); |
---|
285 | var ticks = this._ticks; |
---|
286 | var trans = function (v) { return Math.log(v)/Math.log(lb); }; |
---|
287 | var invtrans = function (v) { return Math.pow(Math.E, (Math.log(lb)*v)); }; |
---|
288 | var max = trans(this.max); |
---|
289 | var min = trans(this.min); |
---|
290 | var offmax = offsets.max; |
---|
291 | var offmin = offsets.min; |
---|
292 | var lshow = (this._label == null) ? false : this._label.show; |
---|
293 | |
---|
294 | for (var p in pos) { |
---|
295 | this._elem.css(p, pos[p]); |
---|
296 | } |
---|
297 | |
---|
298 | this._offsets = offsets; |
---|
299 | // pixellength will be + for x axes and - for y axes becasue pixels always measured from top left. |
---|
300 | var pixellength = offmax - offmin; |
---|
301 | var unitlength = max - min; |
---|
302 | |
---|
303 | // point to unit and unit to point conversions references to Plot DOM element top left corner. |
---|
304 | this.p2u = function(p){ |
---|
305 | return invtrans((p - offmin) * unitlength / pixellength + min); |
---|
306 | }; |
---|
307 | |
---|
308 | this.u2p = function(u){ |
---|
309 | return (trans(u) - min) * pixellength / unitlength + offmin; |
---|
310 | }; |
---|
311 | |
---|
312 | if (this.name == 'xaxis' || this.name == 'x2axis'){ |
---|
313 | this.series_u2p = function(u){ |
---|
314 | return (trans(u) - min) * pixellength / unitlength; |
---|
315 | }; |
---|
316 | this.series_p2u = function(p){ |
---|
317 | return invtrans(p * unitlength / pixellength + min); |
---|
318 | }; |
---|
319 | } |
---|
320 | // yaxis is max at top of canvas. |
---|
321 | else { |
---|
322 | this.series_u2p = function(u){ |
---|
323 | return (trans(u) - max) * pixellength / unitlength; |
---|
324 | }; |
---|
325 | this.series_p2u = function(p){ |
---|
326 | return invtrans(p * unitlength / pixellength + max); |
---|
327 | }; |
---|
328 | } |
---|
329 | |
---|
330 | if (this.show) { |
---|
331 | if (this.name == 'xaxis' || this.name == 'x2axis') { |
---|
332 | for (var i=0; i<ticks.length; i++) { |
---|
333 | var t = ticks[i]; |
---|
334 | if (t.show && t.showLabel) { |
---|
335 | var shim; |
---|
336 | |
---|
337 | if (t.constructor == $.jqplot.CanvasAxisTickRenderer && t.angle) { |
---|
338 | switch (t.labelPosition) { |
---|
339 | case 'auto': |
---|
340 | // position at end |
---|
341 | if (t.angle < 0) { |
---|
342 | shim = -t.getWidth() + t._textRenderer.height * Math.sin(-t._textRenderer.angle) / 2; |
---|
343 | } |
---|
344 | // position at start |
---|
345 | else { |
---|
346 | shim = -t._textRenderer.height * Math.sin(t._textRenderer.angle) / 2; |
---|
347 | } |
---|
348 | break; |
---|
349 | case 'end': |
---|
350 | shim = -t.getWidth() + t._textRenderer.height * Math.sin(-t._textRenderer.angle) / 2; |
---|
351 | break; |
---|
352 | case 'start': |
---|
353 | shim = -t._textRenderer.height * Math.sin(t._textRenderer.angle) / 2; |
---|
354 | break; |
---|
355 | case 'middle': |
---|
356 | shim = -t.getWidth()/2 + t._textRenderer.height * Math.sin(-t._textRenderer.angle) / 2; |
---|
357 | break; |
---|
358 | default: |
---|
359 | shim = -t.getWidth()/2 + t._textRenderer.height * Math.sin(-t._textRenderer.angle) / 2; |
---|
360 | break; |
---|
361 | } |
---|
362 | } |
---|
363 | else { |
---|
364 | shim = -t.getWidth()/2; |
---|
365 | } |
---|
366 | // var shim = t.getWidth()/2; |
---|
367 | var val = this.u2p(t.value) + shim + 'px'; |
---|
368 | t._elem.css('left', val); |
---|
369 | t.pack(); |
---|
370 | } |
---|
371 | } |
---|
372 | if (lshow) { |
---|
373 | var w = this._label._elem.outerWidth(true); |
---|
374 | this._label._elem.css('left', offmin + pixellength/2 - w/2 + 'px'); |
---|
375 | if (this.name == 'xaxis') { |
---|
376 | this._label._elem.css('bottom', '0px'); |
---|
377 | } |
---|
378 | else { |
---|
379 | this._label._elem.css('top', '0px'); |
---|
380 | } |
---|
381 | this._label.pack(); |
---|
382 | } |
---|
383 | } |
---|
384 | else { |
---|
385 | for (var i=0; i<ticks.length; i++) { |
---|
386 | var t = ticks[i]; |
---|
387 | if (t.show && t.showLabel) { |
---|
388 | var shim; |
---|
389 | if (t.constructor == $.jqplot.CanvasAxisTickRenderer && t.angle) { |
---|
390 | switch (t.labelPosition) { |
---|
391 | case 'auto': |
---|
392 | // position at end |
---|
393 | case 'end': |
---|
394 | if (t.angle < 0) { |
---|
395 | shim = -t._textRenderer.height * Math.cos(-t._textRenderer.angle) / 2; |
---|
396 | } |
---|
397 | else { |
---|
398 | shim = -t.getHeight() + t._textRenderer.height * Math.cos(t._textRenderer.angle) / 2; |
---|
399 | } |
---|
400 | break; |
---|
401 | case 'start': |
---|
402 | if (t.angle > 0) { |
---|
403 | shim = -t._textRenderer.height * Math.cos(-t._textRenderer.angle) / 2; |
---|
404 | } |
---|
405 | else { |
---|
406 | shim = -t.getHeight() + t._textRenderer.height * Math.cos(t._textRenderer.angle) / 2; |
---|
407 | } |
---|
408 | break; |
---|
409 | case 'middle': |
---|
410 | // if (t.angle > 0) { |
---|
411 | // shim = -t.getHeight()/2 + t._textRenderer.height * Math.sin(-t._textRenderer.angle) / 2; |
---|
412 | // } |
---|
413 | // else { |
---|
414 | // shim = -t.getHeight()/2 - t._textRenderer.height * Math.sin(t._textRenderer.angle) / 2; |
---|
415 | // } |
---|
416 | shim = -t.getHeight()/2; |
---|
417 | break; |
---|
418 | default: |
---|
419 | shim = -t.getHeight()/2; |
---|
420 | break; |
---|
421 | } |
---|
422 | } |
---|
423 | else { |
---|
424 | shim = -t.getHeight()/2; |
---|
425 | } |
---|
426 | |
---|
427 | var val = this.u2p(t.value) + shim + 'px'; |
---|
428 | t._elem.css('top', val); |
---|
429 | t.pack(); |
---|
430 | } |
---|
431 | } |
---|
432 | if (lshow) { |
---|
433 | var h = this._label._elem.outerHeight(true); |
---|
434 | this._label._elem.css('top', offmax - pixellength/2 - h/2 + 'px'); |
---|
435 | if (this.name == 'yaxis') { |
---|
436 | this._label._elem.css('left', '0px'); |
---|
437 | } |
---|
438 | else { |
---|
439 | this._label._elem.css('right', '0px'); |
---|
440 | } |
---|
441 | this._label.pack(); |
---|
442 | } |
---|
443 | } |
---|
444 | } |
---|
445 | }; |
---|
446 | })(jQuery); |
---|