Subversion-Projekte lars-tiefland.cienc

Revision

Details | Letzte Änderung | Log anzeigen | RSS feed

Revision Autor Zeilennr. Zeile
5 lars 1
/* Pretty handling of time axes.
2
 
3
Copyright (c) 2007-2014 IOLA and Ole Laursen.
4
Licensed under the MIT license.
5
 
6
Set axis.mode to "time" to enable. See the section "Time series data" in
7
API.txt for details.
8
 
9
*/
10
 
11
(function($) {
12
 
13
	var options = {
14
		xaxis: {
15
			timezone: null,		// "browser" for local to the client or timezone for timezone-js
16
			timeformat: null,	// format string to use
17
			twelveHourClock: false,	// 12 or 24 time in time mode
18
			monthNames: null	// list of names of months
19
		}
20
	};
21
 
22
	// round to nearby lower multiple of base
23
 
24
	function floorInBase(n, base) {
25
		return base * Math.floor(n / base);
26
	}
27
 
28
	// Returns a string with the date d formatted according to fmt.
29
	// A subset of the Open Group's strftime format is supported.
30
 
31
	function formatDate(d, fmt, monthNames, dayNames) {
32
 
33
		if (typeof d.strftime == "function") {
34
			return d.strftime(fmt);
35
		}
36
 
37
		var leftPad = function(n, pad) {
38
			n = "" + n;
39
			pad = "" + (pad == null ? "0" : pad);
40
			return n.length == 1 ? pad + n : n;
41
		};
42
 
43
		var r = [];
44
		var escape = false;
45
		var hours = d.getHours();
46
		var isAM = hours < 12;
47
 
48
		if (monthNames == null) {
49
			monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
50
		}
51
 
52
		if (dayNames == null) {
53
			dayNames = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
54
		}
55
 
56
		var hours12;
57
 
58
		if (hours > 12) {
59
			hours12 = hours - 12;
60
		} else if (hours == 0) {
61
			hours12 = 12;
62
		} else {
63
			hours12 = hours;
64
		}
65
 
66
		for (var i = 0; i < fmt.length; ++i) {
67
 
68
			var c = fmt.charAt(i);
69
 
70
			if (escape) {
71
				switch (c) {
72
					case 'a': c = "" + dayNames[d.getDay()]; break;
73
					case 'b': c = "" + monthNames[d.getMonth()]; break;
74
					case 'd': c = leftPad(d.getDate()); break;
75
					case 'e': c = leftPad(d.getDate(), " "); break;
76
					case 'h':	// For back-compat with 0.7; remove in 1.0
77
					case 'H': c = leftPad(hours); break;
78
					case 'I': c = leftPad(hours12); break;
79
					case 'l': c = leftPad(hours12, " "); break;
80
					case 'm': c = leftPad(d.getMonth() + 1); break;
81
					case 'M': c = leftPad(d.getMinutes()); break;
82
					// quarters not in Open Group's strftime specification
83
					case 'q':
84
						c = "" + (Math.floor(d.getMonth() / 3) + 1); break;
85
					case 'S': c = leftPad(d.getSeconds()); break;
86
					case 'y': c = leftPad(d.getFullYear() % 100); break;
87
					case 'Y': c = "" + d.getFullYear(); break;
88
					case 'p': c = (isAM) ? ("" + "am") : ("" + "pm"); break;
89
					case 'P': c = (isAM) ? ("" + "AM") : ("" + "PM"); break;
90
					case 'w': c = "" + d.getDay(); break;
91
				}
92
				r.push(c);
93
				escape = false;
94
			} else {
95
				if (c == "%") {
96
					escape = true;
97
				} else {
98
					r.push(c);
99
				}
100
			}
101
		}
102
 
103
		return r.join("");
104
	}
105
 
106
	// To have a consistent view of time-based data independent of which time
107
	// zone the client happens to be in we need a date-like object independent
108
	// of time zones.  This is done through a wrapper that only calls the UTC
109
	// versions of the accessor methods.
110
 
111
	function makeUtcWrapper(d) {
112
 
113
		function addProxyMethod(sourceObj, sourceMethod, targetObj, targetMethod) {
114
			sourceObj[sourceMethod] = function() {
115
				return targetObj[targetMethod].apply(targetObj, arguments);
116
			};
117
		};
118
 
119
		var utc = {
120
			date: d
121
		};
122
 
123
		// support strftime, if found
124
 
125
		if (d.strftime != undefined) {
126
			addProxyMethod(utc, "strftime", d, "strftime");
127
		}
128
 
129
		addProxyMethod(utc, "getTime", d, "getTime");
130
		addProxyMethod(utc, "setTime", d, "setTime");
131
 
132
		var props = ["Date", "Day", "FullYear", "Hours", "Milliseconds", "Minutes", "Month", "Seconds"];
133
 
134
		for (var p = 0; p < props.length; p++) {
135
			addProxyMethod(utc, "get" + props[p], d, "getUTC" + props[p]);
136
			addProxyMethod(utc, "set" + props[p], d, "setUTC" + props[p]);
137
		}
138
 
139
		return utc;
140
	};
141
 
142
	// select time zone strategy.  This returns a date-like object tied to the
143
	// desired timezone
144
 
145
	function dateGenerator(ts, opts) {
146
		if (opts.timezone == "browser") {
147
			return new Date(ts);
148
		} else if (!opts.timezone || opts.timezone == "utc") {
149
			return makeUtcWrapper(new Date(ts));
150
		} else if (typeof timezoneJS != "undefined" && typeof timezoneJS.Date != "undefined") {
151
			var d = new timezoneJS.Date();
152
			// timezone-js is fickle, so be sure to set the time zone before
153
			// setting the time.
154
			d.setTimezone(opts.timezone);
155
			d.setTime(ts);
156
			return d;
157
		} else {
158
			return makeUtcWrapper(new Date(ts));
159
		}
160
	}
161
 
162
	// map of app. size of time units in milliseconds
163
 
164
	var timeUnitSize = {
165
		"second": 1000,
166
		"minute": 60 * 1000,
167
		"hour": 60 * 60 * 1000,
168
		"day": 24 * 60 * 60 * 1000,
169
		"month": 30 * 24 * 60 * 60 * 1000,
170
		"quarter": 3 * 30 * 24 * 60 * 60 * 1000,
171
		"year": 365.2425 * 24 * 60 * 60 * 1000
172
	};
173
 
174
	// the allowed tick sizes, after 1 year we use
175
	// an integer algorithm
176
 
177
	var baseSpec = [
178
		[1, "second"], [2, "second"], [5, "second"], [10, "second"],
179
		[30, "second"],
180
		[1, "minute"], [2, "minute"], [5, "minute"], [10, "minute"],
181
		[30, "minute"],
182
		[1, "hour"], [2, "hour"], [4, "hour"],
183
		[8, "hour"], [12, "hour"],
184
		[1, "day"], [2, "day"], [3, "day"],
185
		[0.25, "month"], [0.5, "month"], [1, "month"],
186
		[2, "month"]
187
	];
188
 
189
	// we don't know which variant(s) we'll need yet, but generating both is
190
	// cheap
191
 
192
	var specMonths = baseSpec.concat([[3, "month"], [6, "month"],
193
		[1, "year"]]);
194
	var specQuarters = baseSpec.concat([[1, "quarter"], [2, "quarter"],
195
		[1, "year"]]);
196
 
197
	function init(plot) {
198
		plot.hooks.processOptions.push(function (plot, options) {
199
			$.each(plot.getAxes(), function(axisName, axis) {
200
 
201
				var opts = axis.options;
202
 
203
				if (opts.mode == "time") {
204
					axis.tickGenerator = function(axis) {
205
 
206
						var ticks = [];
207
						var d = dateGenerator(axis.min, opts);
208
						var minSize = 0;
209
 
210
						// make quarter use a possibility if quarters are
211
						// mentioned in either of these options
212
 
213
						var spec = (opts.tickSize && opts.tickSize[1] ===
214
							"quarter") ||
215
							(opts.minTickSize && opts.minTickSize[1] ===
216
							"quarter") ? specQuarters : specMonths;
217
 
218
						if (opts.minTickSize != null) {
219
							if (typeof opts.tickSize == "number") {
220
								minSize = opts.tickSize;
221
							} else {
222
								minSize = opts.minTickSize[0] * timeUnitSize[opts.minTickSize[1]];
223
							}
224
						}
225
 
226
						for (var i = 0; i < spec.length - 1; ++i) {
227
							if (axis.delta < (spec[i][0] * timeUnitSize[spec[i][1]]
228
											  + spec[i + 1][0] * timeUnitSize[spec[i + 1][1]]) / 2
229
								&& spec[i][0] * timeUnitSize[spec[i][1]] >= minSize) {
230
								break;
231
							}
232
						}
233
 
234
						var size = spec[i][0];
235
						var unit = spec[i][1];
236
 
237
						// special-case the possibility of several years
238
 
239
						if (unit == "year") {
240
 
241
							// if given a minTickSize in years, just use it,
242
							// ensuring that it's an integer
243
 
244
							if (opts.minTickSize != null && opts.minTickSize[1] == "year") {
245
								size = Math.floor(opts.minTickSize[0]);
246
							} else {
247
 
248
								var magn = Math.pow(10, Math.floor(Math.log(axis.delta / timeUnitSize.year) / Math.LN10));
249
								var norm = (axis.delta / timeUnitSize.year) / magn;
250
 
251
								if (norm < 1.5) {
252
									size = 1;
253
								} else if (norm < 3) {
254
									size = 2;
255
								} else if (norm < 7.5) {
256
									size = 5;
257
								} else {
258
									size = 10;
259
								}
260
 
261
								size *= magn;
262
							}
263
 
264
							// minimum size for years is 1
265
 
266
							if (size < 1) {
267
								size = 1;
268
							}
269
						}
270
 
271
						axis.tickSize = opts.tickSize || [size, unit];
272
						var tickSize = axis.tickSize[0];
273
						unit = axis.tickSize[1];
274
 
275
						var step = tickSize * timeUnitSize[unit];
276
 
277
						if (unit == "second") {
278
							d.setSeconds(floorInBase(d.getSeconds(), tickSize));
279
						} else if (unit == "minute") {
280
							d.setMinutes(floorInBase(d.getMinutes(), tickSize));
281
						} else if (unit == "hour") {
282
							d.setHours(floorInBase(d.getHours(), tickSize));
283
						} else if (unit == "month") {
284
							d.setMonth(floorInBase(d.getMonth(), tickSize));
285
						} else if (unit == "quarter") {
286
							d.setMonth(3 * floorInBase(d.getMonth() / 3,
287
								tickSize));
288
						} else if (unit == "year") {
289
							d.setFullYear(floorInBase(d.getFullYear(), tickSize));
290
						}
291
 
292
						// reset smaller components
293
 
294
						d.setMilliseconds(0);
295
 
296
						if (step >= timeUnitSize.minute) {
297
							d.setSeconds(0);
298
						}
299
						if (step >= timeUnitSize.hour) {
300
							d.setMinutes(0);
301
						}
302
						if (step >= timeUnitSize.day) {
303
							d.setHours(0);
304
						}
305
						if (step >= timeUnitSize.day * 4) {
306
							d.setDate(1);
307
						}
308
						if (step >= timeUnitSize.month * 2) {
309
							d.setMonth(floorInBase(d.getMonth(), 3));
310
						}
311
						if (step >= timeUnitSize.quarter * 2) {
312
							d.setMonth(floorInBase(d.getMonth(), 6));
313
						}
314
						if (step >= timeUnitSize.year) {
315
							d.setMonth(0);
316
						}
317
 
318
						var carry = 0;
319
						var v = Number.NaN;
320
						var prev;
321
 
322
						do {
323
 
324
							prev = v;
325
							v = d.getTime();
326
							ticks.push(v);
327
 
328
							if (unit == "month" || unit == "quarter") {
329
								if (tickSize < 1) {
330
 
331
									// a bit complicated - we'll divide the
332
									// month/quarter up but we need to take
333
									// care of fractions so we don't end up in
334
									// the middle of a day
335
 
336
									d.setDate(1);
337
									var start = d.getTime();
338
									d.setMonth(d.getMonth() +
339
										(unit == "quarter" ? 3 : 1));
340
									var end = d.getTime();
341
									d.setTime(v + carry * timeUnitSize.hour + (end - start) * tickSize);
342
									carry = d.getHours();
343
									d.setHours(0);
344
								} else {
345
									d.setMonth(d.getMonth() +
346
										tickSize * (unit == "quarter" ? 3 : 1));
347
								}
348
							} else if (unit == "year") {
349
								d.setFullYear(d.getFullYear() + tickSize);
350
							} else {
351
								d.setTime(v + step);
352
							}
353
						} while (v < axis.max && v != prev);
354
 
355
						return ticks;
356
					};
357
 
358
					axis.tickFormatter = function (v, axis) {
359
 
360
						var d = dateGenerator(v, axis.options);
361
 
362
						// first check global format
363
 
364
						if (opts.timeformat != null) {
365
							return formatDate(d, opts.timeformat, opts.monthNames, opts.dayNames);
366
						}
367
 
368
						// possibly use quarters if quarters are mentioned in
369
						// any of these places
370
 
371
						var useQuarters = (axis.options.tickSize &&
372
								axis.options.tickSize[1] == "quarter") ||
373
							(axis.options.minTickSize &&
374
								axis.options.minTickSize[1] == "quarter");
375
 
376
						var t = axis.tickSize[0] * timeUnitSize[axis.tickSize[1]];
377
						var span = axis.max - axis.min;
378
						var suffix = (opts.twelveHourClock) ? " %p" : "";
379
						var hourCode = (opts.twelveHourClock) ? "%I" : "%H";
380
						var fmt;
381
 
382
						if (t < timeUnitSize.minute) {
383
							fmt = hourCode + ":%M:%S" + suffix;
384
						} else if (t < timeUnitSize.day) {
385
							if (span < 2 * timeUnitSize.day) {
386
								fmt = hourCode + ":%M" + suffix;
387
							} else {
388
								fmt = "%b %d " + hourCode + ":%M" + suffix;
389
							}
390
						} else if (t < timeUnitSize.month) {
391
							fmt = "%b %d";
392
						} else if ((useQuarters && t < timeUnitSize.quarter) ||
393
							(!useQuarters && t < timeUnitSize.year)) {
394
							if (span < timeUnitSize.year) {
395
								fmt = "%b";
396
							} else {
397
								fmt = "%b %Y";
398
							}
399
						} else if (useQuarters && t < timeUnitSize.year) {
400
							if (span < timeUnitSize.year) {
401
								fmt = "Q%q";
402
							} else {
403
								fmt = "Q%q %Y";
404
							}
405
						} else {
406
							fmt = "%Y";
407
						}
408
 
409
						var rt = formatDate(d, fmt, opts.monthNames, opts.dayNames);
410
 
411
						return rt;
412
					};
413
				}
414
			});
415
		});
416
	}
417
 
418
	$.plot.plugins.push({
419
		init: init,
420
		options: options,
421
		name: 'time',
422
		version: '1.0'
423
	});
424
 
425
	// Time-axis support used to be in Flot core, which exposed the
426
	// formatDate function on the plot object.  Various plugins depend
427
	// on the function, so we need to re-expose it here.
428
 
429
	$.plot.formatDate = formatDate;
430
	$.plot.dateGenerator = dateGenerator;
431
 
432
})(jQuery);