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 | /** |
---|
33 | * Class: $.jqplot.PointLabels |
---|
34 | * Plugin for putting labels at the data points. |
---|
35 | * |
---|
36 | * To use this plugin, include the js |
---|
37 | * file in your source: |
---|
38 | * |
---|
39 | * > <script type="text/javascript" src="plugins/jqplot.pointLabels.js"></script> |
---|
40 | * |
---|
41 | * By default, the last value in the data ponit array in the data series is used |
---|
42 | * for the label. For most series renderers, extra data can be added to the |
---|
43 | * data point arrays and the last value will be used as the label. |
---|
44 | * |
---|
45 | * For instance, |
---|
46 | * this series: |
---|
47 | * |
---|
48 | * > [[1,4], [3,5], [7,2]] |
---|
49 | * |
---|
50 | * Would, by default, use the y values in the labels. |
---|
51 | * Extra data can be added to the series like so: |
---|
52 | * |
---|
53 | * > [[1,4,'mid'], [3 5,'hi'], [7,2,'low']] |
---|
54 | * |
---|
55 | * And now the point labels would be 'mid', 'low', and 'hi'. |
---|
56 | * |
---|
57 | * Options to the point labels and a custom labels array can be passed into the |
---|
58 | * "pointLabels" option on the series option like so: |
---|
59 | * |
---|
60 | * > series:[{pointLabels:{ |
---|
61 | * > labels:['mid', 'hi', 'low'], |
---|
62 | * > location:'se', |
---|
63 | * > ypadding: 12 |
---|
64 | * > } |
---|
65 | * > }] |
---|
66 | * |
---|
67 | * A custom labels array in the options takes precendence over any labels |
---|
68 | * in the series data. If you have a custom labels array in the options, |
---|
69 | * but still want to use values from the series array as labels, set the |
---|
70 | * "labelsFromSeries" option to true. |
---|
71 | * |
---|
72 | * By default, html entities (<, >, etc.) are escaped in point labels. |
---|
73 | * If you want to include actual html markup in the labels, |
---|
74 | * set the "escapeHTML" option to false. |
---|
75 | * |
---|
76 | */ |
---|
77 | $.jqplot.PointLabels = function(options) { |
---|
78 | // Group: Properties |
---|
79 | // |
---|
80 | // prop: show |
---|
81 | // show the labels or not. |
---|
82 | this.show = $.jqplot.config.enablePlugins; |
---|
83 | // prop: location |
---|
84 | // compass location where to position the label around the point. |
---|
85 | // 'n', 'ne', 'e', 'se', 's', 'sw', 'w', 'nw' |
---|
86 | this.location = 'n'; |
---|
87 | // prop: labelsFromSeries |
---|
88 | // true to use labels within data point arrays. |
---|
89 | this.labelsFromSeries = false; |
---|
90 | // prop: seriesLabelIndex |
---|
91 | // array index for location of labels within data point arrays. |
---|
92 | // if null, will use the last element of the data point array. |
---|
93 | this.seriesLabelIndex = null; |
---|
94 | // prop: labels |
---|
95 | // array of arrays of labels, one array for each series. |
---|
96 | this.labels = []; |
---|
97 | // actual labels that will get displayed. |
---|
98 | // needed to preserve user specified labels in labels array. |
---|
99 | this._labels = []; |
---|
100 | // prop: stackedValue |
---|
101 | // true to display value as stacked in a stacked plot. |
---|
102 | // no effect if labels is specified. |
---|
103 | this.stackedValue = false; |
---|
104 | // prop: ypadding |
---|
105 | // vertical padding in pixels between point and label |
---|
106 | this.ypadding = 6; |
---|
107 | // prop: xpadding |
---|
108 | // horizontal padding in pixels between point and label |
---|
109 | this.xpadding = 6; |
---|
110 | // prop: escapeHTML |
---|
111 | // true to escape html entities in the labels. |
---|
112 | // If you want to include markup in the labels, set to false. |
---|
113 | this.escapeHTML = true; |
---|
114 | // prop: edgeTolerance |
---|
115 | // Number of pixels that the label must be away from an axis |
---|
116 | // boundary in order to be drawn. Negative values will allow overlap |
---|
117 | // with the grid boundaries. |
---|
118 | this.edgeTolerance = -5; |
---|
119 | // prop: formatter |
---|
120 | // A class of a formatter for the tick text. sprintf by default. |
---|
121 | this.formatter = $.jqplot.DefaultTickFormatter; |
---|
122 | // prop: formatString |
---|
123 | // string passed to the formatter. |
---|
124 | this.formatString = ''; |
---|
125 | // prop: hideZeros |
---|
126 | // true to not show a label for a value which is 0. |
---|
127 | this.hideZeros = false; |
---|
128 | this._elems = []; |
---|
129 | |
---|
130 | $.extend(true, this, options); |
---|
131 | }; |
---|
132 | |
---|
133 | var locations = ['nw', 'n', 'ne', 'e', 'se', 's', 'sw', 'w']; |
---|
134 | var locationIndicies = {'nw':0, 'n':1, 'ne':2, 'e':3, 'se':4, 's':5, 'sw':6, 'w':7}; |
---|
135 | var oppositeLocations = ['se', 's', 'sw', 'w', 'nw', 'n', 'ne', 'e']; |
---|
136 | |
---|
137 | // called with scope of a series |
---|
138 | $.jqplot.PointLabels.init = function (target, data, seriesDefaults, opts){ |
---|
139 | var options = $.extend(true, {}, seriesDefaults, opts); |
---|
140 | options.pointLabels = options.pointLabels || {}; |
---|
141 | if (this.renderer.constructor == $.jqplot.BarRenderer && this.barDirection == 'horizontal' && !options.pointLabels.location) { |
---|
142 | options.pointLabels.location = 'e'; |
---|
143 | } |
---|
144 | // add a pointLabels attribute to the series plugins |
---|
145 | this.plugins.pointLabels = new $.jqplot.PointLabels(options.pointLabels); |
---|
146 | this.plugins.pointLabels.setLabels.call(this); |
---|
147 | }; |
---|
148 | |
---|
149 | // called with scope of series |
---|
150 | $.jqplot.PointLabels.prototype.setLabels = function() { |
---|
151 | var p = this.plugins.pointLabels; |
---|
152 | var labelIdx; |
---|
153 | if (p.seriesLabelIndex != null) { |
---|
154 | labelIdx = p.seriesLabelIndex; |
---|
155 | } |
---|
156 | else if (this.renderer.constructor == $.jqplot.BarRenderer && this.barDirection == 'horizontal') { |
---|
157 | labelIdx = 0; |
---|
158 | } |
---|
159 | else { |
---|
160 | labelIdx = this._plotData[0].length -1; |
---|
161 | } |
---|
162 | p._labels = []; |
---|
163 | if (p.labels.length == 0 || p.labelsFromSeries) { |
---|
164 | if (p.stackedValue) { |
---|
165 | if (this._plotData.length && this._plotData[0].length){ |
---|
166 | // var idx = p.seriesLabelIndex || this._plotData[0].length -1; |
---|
167 | for (var i=0; i<this._plotData.length; i++) { |
---|
168 | p._labels.push(this._plotData[i][labelIdx]); |
---|
169 | } |
---|
170 | } |
---|
171 | } |
---|
172 | else { |
---|
173 | var d = this._plotData; |
---|
174 | if (this.renderer.constructor == $.jqplot.BarRenderer && this.waterfall) { |
---|
175 | d = this._data; |
---|
176 | } |
---|
177 | if (d.length && d[0].length) { |
---|
178 | // var idx = p.seriesLabelIndex || d[0].length -1; |
---|
179 | for (var i=0; i<d.length; i++) { |
---|
180 | p._labels.push(d[i][labelIdx]); |
---|
181 | } |
---|
182 | } |
---|
183 | d = null; |
---|
184 | } |
---|
185 | } |
---|
186 | else if (p.labels.length){ |
---|
187 | p._labels = p.labels; |
---|
188 | } |
---|
189 | }; |
---|
190 | |
---|
191 | $.jqplot.PointLabels.prototype.xOffset = function(elem, location, padding) { |
---|
192 | location = location || this.location; |
---|
193 | padding = padding || this.xpadding; |
---|
194 | var offset; |
---|
195 | |
---|
196 | switch (location) { |
---|
197 | case 'nw': |
---|
198 | offset = -elem.outerWidth(true) - this.xpadding; |
---|
199 | break; |
---|
200 | case 'n': |
---|
201 | offset = -elem.outerWidth(true)/2; |
---|
202 | break; |
---|
203 | case 'ne': |
---|
204 | offset = this.xpadding; |
---|
205 | break; |
---|
206 | case 'e': |
---|
207 | offset = this.xpadding; |
---|
208 | break; |
---|
209 | case 'se': |
---|
210 | offset = this.xpadding; |
---|
211 | break; |
---|
212 | case 's': |
---|
213 | offset = -elem.outerWidth(true)/2; |
---|
214 | break; |
---|
215 | case 'sw': |
---|
216 | offset = -elem.outerWidth(true) - this.xpadding; |
---|
217 | break; |
---|
218 | case 'w': |
---|
219 | offset = -elem.outerWidth(true) - this.xpadding; |
---|
220 | break; |
---|
221 | default: // same as 'nw' |
---|
222 | offset = -elem.outerWidth(true) - this.xpadding; |
---|
223 | break; |
---|
224 | } |
---|
225 | return offset; |
---|
226 | }; |
---|
227 | |
---|
228 | $.jqplot.PointLabels.prototype.yOffset = function(elem, location, padding) { |
---|
229 | location = location || this.location; |
---|
230 | padding = padding || this.xpadding; |
---|
231 | var offset; |
---|
232 | |
---|
233 | switch (location) { |
---|
234 | case 'nw': |
---|
235 | offset = -elem.outerHeight(true) - this.ypadding; |
---|
236 | break; |
---|
237 | case 'n': |
---|
238 | offset = -elem.outerHeight(true) - this.ypadding; |
---|
239 | break; |
---|
240 | case 'ne': |
---|
241 | offset = -elem.outerHeight(true) - this.ypadding; |
---|
242 | break; |
---|
243 | case 'e': |
---|
244 | offset = -elem.outerHeight(true)/2; |
---|
245 | break; |
---|
246 | case 'se': |
---|
247 | offset = this.ypadding; |
---|
248 | break; |
---|
249 | case 's': |
---|
250 | offset = this.ypadding; |
---|
251 | break; |
---|
252 | case 'sw': |
---|
253 | offset = this.ypadding; |
---|
254 | break; |
---|
255 | case 'w': |
---|
256 | offset = -elem.outerHeight(true)/2; |
---|
257 | break; |
---|
258 | default: // same as 'nw' |
---|
259 | offset = -elem.outerHeight(true) - this.ypadding; |
---|
260 | break; |
---|
261 | } |
---|
262 | return offset; |
---|
263 | }; |
---|
264 | |
---|
265 | // called with scope of series |
---|
266 | $.jqplot.PointLabels.draw = function (sctx, options) { |
---|
267 | var p = this.plugins.pointLabels; |
---|
268 | // set labels again in case they have changed. |
---|
269 | p.setLabels.call(this); |
---|
270 | // remove any previous labels |
---|
271 | for (var i=0; i<p._elems.length; i++) { |
---|
272 | // Memory Leaks patch |
---|
273 | // p._elems[i].remove(); |
---|
274 | p._elems[i].emptyForce(); |
---|
275 | } |
---|
276 | p._elems.splice(0, p._elems.length); |
---|
277 | |
---|
278 | if (p.show) { |
---|
279 | var ax = '_'+this._stackAxis+'axis'; |
---|
280 | |
---|
281 | if (!p.formatString) { |
---|
282 | p.formatString = this[ax]._ticks[0].formatString; |
---|
283 | p.formatter = this[ax]._ticks[0].formatter; |
---|
284 | } |
---|
285 | |
---|
286 | var pd = this._plotData; |
---|
287 | var xax = this._xaxis; |
---|
288 | var yax = this._yaxis; |
---|
289 | var elem, helem; |
---|
290 | |
---|
291 | for (var i=0, l=p._labels.length; i < l; i++) { |
---|
292 | var label = p._labels[i]; |
---|
293 | |
---|
294 | if (p.hideZeros && parseInt(p._labels[i], 10) == 0) { |
---|
295 | label = ''; |
---|
296 | } |
---|
297 | |
---|
298 | if (label != null) { |
---|
299 | label = p.formatter(p.formatString, label); |
---|
300 | } |
---|
301 | |
---|
302 | helem = document.createElement('div'); |
---|
303 | p._elems[i] = $(helem); |
---|
304 | |
---|
305 | elem = p._elems[i]; |
---|
306 | |
---|
307 | |
---|
308 | elem.addClass('jqplot-point-label jqplot-series-'+this.index+' jqplot-point-'+i); |
---|
309 | elem.css('position', 'absolute'); |
---|
310 | elem.insertAfter(sctx.canvas); |
---|
311 | |
---|
312 | if (p.escapeHTML) { |
---|
313 | elem.text(label); |
---|
314 | } |
---|
315 | else { |
---|
316 | elem.html(label); |
---|
317 | } |
---|
318 | var location = p.location; |
---|
319 | if ((this.fillToZero && pd[i][1] < 0) || (this.waterfall && parseInt(label, 10)) < 0) { |
---|
320 | location = oppositeLocations[locationIndicies[location]]; |
---|
321 | } |
---|
322 | var ell = xax.u2p(pd[i][0]) + p.xOffset(elem, location); |
---|
323 | var elt = yax.u2p(pd[i][1]) + p.yOffset(elem, location); |
---|
324 | if (this.renderer.constructor == $.jqplot.BarRenderer) { |
---|
325 | if (this.barDirection == "vertical") { |
---|
326 | ell += this._barNudge; |
---|
327 | } |
---|
328 | else { |
---|
329 | elt -= this._barNudge; |
---|
330 | } |
---|
331 | } |
---|
332 | elem.css('left', ell); |
---|
333 | elem.css('top', elt); |
---|
334 | var elr = ell + elem.width(); |
---|
335 | var elb = elt + elem.height(); |
---|
336 | var et = p.edgeTolerance; |
---|
337 | var scl = $(sctx.canvas).position().left; |
---|
338 | var sct = $(sctx.canvas).position().top; |
---|
339 | var scr = sctx.canvas.width + scl; |
---|
340 | var scb = sctx.canvas.height + sct; |
---|
341 | // if label is outside of allowed area, remove it |
---|
342 | if (ell - et < scl || elt - et < sct || elr + et > scr || elb + et > scb) { |
---|
343 | elem.remove(); |
---|
344 | } |
---|
345 | elem = null; |
---|
346 | helem = null; |
---|
347 | } |
---|
348 | } |
---|
349 | }; |
---|
350 | |
---|
351 | $.jqplot.postSeriesInitHooks.push($.jqplot.PointLabels.init); |
---|
352 | $.jqplot.postDrawSeriesHooks.push($.jqplot.PointLabels.draw); |
---|
353 | })(jQuery); |
---|