flot-rails 0.0.2 → 0.0.3
Sign up to get free protection for your applications and to get access to all the features.
- data/README.md +2 -2
- data/lib/flot/rails/version.rb +2 -2
- data/vendor/assets/javascripts/excanvas.js +1428 -1427
- data/vendor/assets/javascripts/excanvas.min.js +1 -1
- data/vendor/assets/javascripts/jquery.colorhelpers.js +179 -179
- data/vendor/assets/javascripts/jquery.colorhelpers.min.js +21 -1
- data/vendor/assets/javascripts/jquery.flot.canvas.js +317 -0
- data/vendor/assets/javascripts/jquery.flot.canvas.min.js +28 -0
- data/vendor/assets/javascripts/jquery.flot.categories.js +190 -0
- data/vendor/assets/javascripts/jquery.flot.categories.min.js +44 -0
- data/vendor/assets/javascripts/jquery.flot.crosshair.js +176 -167
- data/vendor/assets/javascripts/jquery.flot.crosshair.min.js +59 -1
- data/vendor/assets/javascripts/jquery.flot.errorbars.js +353 -0
- data/vendor/assets/javascripts/jquery.flot.errorbars.min.js +63 -0
- data/vendor/assets/javascripts/jquery.flot.fillbetween.js +226 -183
- data/vendor/assets/javascripts/jquery.flot.fillbetween.min.js +30 -1
- data/vendor/assets/javascripts/jquery.flot.image.js +241 -238
- data/vendor/assets/javascripts/jquery.flot.image.min.js +53 -1
- data/vendor/assets/javascripts/jquery.flot.js +2980 -2599
- data/vendor/assets/javascripts/jquery.flot.min.js +26 -4
- data/vendor/assets/javascripts/jquery.flot.navigate.js +345 -336
- data/vendor/assets/javascripts/jquery.flot.navigate.min.js +96 -1
- data/vendor/assets/javascripts/jquery.flot.pie.js +561 -499
- data/vendor/assets/javascripts/jquery.flot.pie.min.js +56 -1
- data/vendor/assets/javascripts/jquery.flot.resize.js +60 -60
- data/vendor/assets/javascripts/jquery.flot.resize.min.js +21 -1
- data/vendor/assets/javascripts/jquery.flot.selection.js +360 -344
- data/vendor/assets/javascripts/jquery.flot.selection.min.js +79 -1
- data/vendor/assets/javascripts/jquery.flot.stack.js +188 -184
- data/vendor/assets/javascripts/jquery.flot.stack.min.js +36 -1
- data/vendor/assets/javascripts/jquery.flot.symbol.js +71 -70
- data/vendor/assets/javascripts/jquery.flot.symbol.min.js +14 -1
- data/vendor/assets/javascripts/jquery.flot.threshold.js +142 -103
- data/vendor/assets/javascripts/jquery.flot.threshold.min.js +43 -1
- data/vendor/assets/javascripts/jquery.flot.time.js +424 -0
- data/vendor/assets/javascripts/jquery.flot.time.min.js +9 -0
- metadata +25 -7
@@ -1 +1,59 @@
|
|
1
|
-
|
1
|
+
/* Flot plugin for showing crosshairs when the mouse hovers over the plot.
|
2
|
+
|
3
|
+
Copyright (c) 2007-2013 IOLA and Ole Laursen.
|
4
|
+
Licensed under the MIT license.
|
5
|
+
|
6
|
+
The plugin supports these options:
|
7
|
+
|
8
|
+
crosshair: {
|
9
|
+
mode: null or "x" or "y" or "xy"
|
10
|
+
color: color
|
11
|
+
lineWidth: number
|
12
|
+
}
|
13
|
+
|
14
|
+
Set the mode to one of "x", "y" or "xy". The "x" mode enables a vertical
|
15
|
+
crosshair that lets you trace the values on the x axis, "y" enables a
|
16
|
+
horizontal crosshair and "xy" enables them both. "color" is the color of the
|
17
|
+
crosshair (default is "rgba(170, 0, 0, 0.80)"), "lineWidth" is the width of
|
18
|
+
the drawn lines (default is 1).
|
19
|
+
|
20
|
+
The plugin also adds four public methods:
|
21
|
+
|
22
|
+
- setCrosshair( pos )
|
23
|
+
|
24
|
+
Set the position of the crosshair. Note that this is cleared if the user
|
25
|
+
moves the mouse. "pos" is in coordinates of the plot and should be on the
|
26
|
+
form { x: xpos, y: ypos } (you can use x2/x3/... if you're using multiple
|
27
|
+
axes), which is coincidentally the same format as what you get from a
|
28
|
+
"plothover" event. If "pos" is null, the crosshair is cleared.
|
29
|
+
|
30
|
+
- clearCrosshair()
|
31
|
+
|
32
|
+
Clear the crosshair.
|
33
|
+
|
34
|
+
- lockCrosshair(pos)
|
35
|
+
|
36
|
+
Cause the crosshair to lock to the current location, no longer updating if
|
37
|
+
the user moves the mouse. Optionally supply a position (passed on to
|
38
|
+
setCrosshair()) to move it to.
|
39
|
+
|
40
|
+
Example usage:
|
41
|
+
|
42
|
+
var myFlot = $.plot( $("#graph"), ..., { crosshair: { mode: "x" } } };
|
43
|
+
$("#graph").bind( "plothover", function ( evt, position, item ) {
|
44
|
+
if ( item ) {
|
45
|
+
// Lock the crosshair to the data point being hovered
|
46
|
+
myFlot.lockCrosshair({
|
47
|
+
x: item.datapoint[ 0 ],
|
48
|
+
y: item.datapoint[ 1 ]
|
49
|
+
});
|
50
|
+
} else {
|
51
|
+
// Return normal crosshair operation
|
52
|
+
myFlot.unlockCrosshair();
|
53
|
+
}
|
54
|
+
});
|
55
|
+
|
56
|
+
- unlockCrosshair()
|
57
|
+
|
58
|
+
Free the crosshair to move again after locking it.
|
59
|
+
*/(function(e){function n(e){function n(n){if(t.locked)return;t.x!=-1&&(t.x=-1,e.triggerRedrawOverlay())}function r(n){if(t.locked)return;if(e.getSelection&&e.getSelection()){t.x=-1;return}var r=e.offset();t.x=Math.max(0,Math.min(n.pageX-r.left,e.width())),t.y=Math.max(0,Math.min(n.pageY-r.top,e.height())),e.triggerRedrawOverlay()}var t={x:-1,y:-1,locked:!1};e.setCrosshair=function(r){if(!r)t.x=-1;else{var i=e.p2c(r);t.x=Math.max(0,Math.min(i.left,e.width())),t.y=Math.max(0,Math.min(i.top,e.height()))}e.triggerRedrawOverlay()},e.clearCrosshair=e.setCrosshair,e.lockCrosshair=function(r){r&&e.setCrosshair(r),t.locked=!0},e.unlockCrosshair=function(){t.locked=!1},e.hooks.bindEvents.push(function(e,t){if(!e.getOptions().crosshair.mode)return;t.mouseout(n),t.mousemove(r)}),e.hooks.drawOverlay.push(function(e,n){var r=e.getOptions().crosshair;if(!r.mode)return;var i=e.getPlotOffset();n.save(),n.translate(i.left,i.top);if(t.x!=-1){var s=e.getOptions().crosshair.lineWidth%2===0?0:.5;n.strokeStyle=r.color,n.lineWidth=r.lineWidth,n.lineJoin="round",n.beginPath();if(r.mode.indexOf("x")!=-1){var o=Math.round(t.x)+s;n.moveTo(o,0),n.lineTo(o,e.height())}if(r.mode.indexOf("y")!=-1){var u=Math.round(t.y)+s;n.moveTo(0,u),n.lineTo(e.width(),u)}n.stroke()}n.restore()}),e.hooks.shutdown.push(function(e,t){t.unbind("mouseout",n),t.unbind("mousemove",r)})}var t={crosshair:{mode:null,color:"rgba(170, 0, 0, 0.80)",lineWidth:1}};e.plot.plugins.push({init:n,options:t,name:"crosshair",version:"1.0"})})(jQuery);
|
@@ -0,0 +1,353 @@
|
|
1
|
+
/* Flot plugin for plotting error bars.
|
2
|
+
|
3
|
+
Copyright (c) 2007-2013 IOLA and Ole Laursen.
|
4
|
+
Licensed under the MIT license.
|
5
|
+
|
6
|
+
Error bars are used to show standard deviation and other statistical
|
7
|
+
properties in a plot.
|
8
|
+
|
9
|
+
* Created by Rui Pereira - rui (dot) pereira (at) gmail (dot) com
|
10
|
+
|
11
|
+
This plugin allows you to plot error-bars over points. Set "errorbars" inside
|
12
|
+
the points series to the axis name over which there will be error values in
|
13
|
+
your data array (*even* if you do not intend to plot them later, by setting
|
14
|
+
"show: null" on xerr/yerr).
|
15
|
+
|
16
|
+
The plugin supports these options:
|
17
|
+
|
18
|
+
series: {
|
19
|
+
points: {
|
20
|
+
errorbars: "x" or "y" or "xy",
|
21
|
+
xerr: {
|
22
|
+
show: null/false or true,
|
23
|
+
asymmetric: null/false or true,
|
24
|
+
upperCap: null or "-" or function,
|
25
|
+
lowerCap: null or "-" or function,
|
26
|
+
color: null or color,
|
27
|
+
radius: null or number
|
28
|
+
},
|
29
|
+
yerr: { same options as xerr }
|
30
|
+
}
|
31
|
+
}
|
32
|
+
|
33
|
+
Each data point array is expected to be of the type:
|
34
|
+
|
35
|
+
"x" [ x, y, xerr ]
|
36
|
+
"y" [ x, y, yerr ]
|
37
|
+
"xy" [ x, y, xerr, yerr ]
|
38
|
+
|
39
|
+
Where xerr becomes xerr_lower,xerr_upper for the asymmetric error case, and
|
40
|
+
equivalently for yerr. Eg., a datapoint for the "xy" case with symmetric
|
41
|
+
error-bars on X and asymmetric on Y would be:
|
42
|
+
|
43
|
+
[ x, y, xerr, yerr_lower, yerr_upper ]
|
44
|
+
|
45
|
+
By default no end caps are drawn. Setting upperCap and/or lowerCap to "-" will
|
46
|
+
draw a small cap perpendicular to the error bar. They can also be set to a
|
47
|
+
user-defined drawing function, with (ctx, x, y, radius) as parameters, as eg.
|
48
|
+
|
49
|
+
function drawSemiCircle( ctx, x, y, radius ) {
|
50
|
+
ctx.beginPath();
|
51
|
+
ctx.arc( x, y, radius, 0, Math.PI, false );
|
52
|
+
ctx.moveTo( x - radius, y );
|
53
|
+
ctx.lineTo( x + radius, y );
|
54
|
+
ctx.stroke();
|
55
|
+
}
|
56
|
+
|
57
|
+
Color and radius both default to the same ones of the points series if not
|
58
|
+
set. The independent radius parameter on xerr/yerr is useful for the case when
|
59
|
+
we may want to add error-bars to a line, without showing the interconnecting
|
60
|
+
points (with radius: 0), and still showing end caps on the error-bars.
|
61
|
+
shadowSize and lineWidth are derived as well from the points series.
|
62
|
+
|
63
|
+
*/
|
64
|
+
|
65
|
+
(function ($) {
|
66
|
+
var options = {
|
67
|
+
series: {
|
68
|
+
points: {
|
69
|
+
errorbars: null, //should be 'x', 'y' or 'xy'
|
70
|
+
xerr: { err: 'x', show: null, asymmetric: null, upperCap: null, lowerCap: null, color: null, radius: null},
|
71
|
+
yerr: { err: 'y', show: null, asymmetric: null, upperCap: null, lowerCap: null, color: null, radius: null}
|
72
|
+
}
|
73
|
+
}
|
74
|
+
};
|
75
|
+
|
76
|
+
function processRawData(plot, series, data, datapoints){
|
77
|
+
if (!series.points.errorbars)
|
78
|
+
return;
|
79
|
+
|
80
|
+
// x,y values
|
81
|
+
var format = [
|
82
|
+
{ x: true, number: true, required: true },
|
83
|
+
{ y: true, number: true, required: true }
|
84
|
+
];
|
85
|
+
|
86
|
+
var errors = series.points.errorbars;
|
87
|
+
// error bars - first X then Y
|
88
|
+
if (errors == 'x' || errors == 'xy') {
|
89
|
+
// lower / upper error
|
90
|
+
if (series.points.xerr.asymmetric) {
|
91
|
+
format.push({ x: true, number: true, required: true });
|
92
|
+
format.push({ x: true, number: true, required: true });
|
93
|
+
} else
|
94
|
+
format.push({ x: true, number: true, required: true });
|
95
|
+
}
|
96
|
+
if (errors == 'y' || errors == 'xy') {
|
97
|
+
// lower / upper error
|
98
|
+
if (series.points.yerr.asymmetric) {
|
99
|
+
format.push({ y: true, number: true, required: true });
|
100
|
+
format.push({ y: true, number: true, required: true });
|
101
|
+
} else
|
102
|
+
format.push({ y: true, number: true, required: true });
|
103
|
+
}
|
104
|
+
datapoints.format = format;
|
105
|
+
}
|
106
|
+
|
107
|
+
function parseErrors(series, i){
|
108
|
+
|
109
|
+
var points = series.datapoints.points;
|
110
|
+
|
111
|
+
// read errors from points array
|
112
|
+
var exl = null,
|
113
|
+
exu = null,
|
114
|
+
eyl = null,
|
115
|
+
eyu = null;
|
116
|
+
var xerr = series.points.xerr,
|
117
|
+
yerr = series.points.yerr;
|
118
|
+
|
119
|
+
var eb = series.points.errorbars;
|
120
|
+
// error bars - first X
|
121
|
+
if (eb == 'x' || eb == 'xy') {
|
122
|
+
if (xerr.asymmetric) {
|
123
|
+
exl = points[i + 2];
|
124
|
+
exu = points[i + 3];
|
125
|
+
if (eb == 'xy')
|
126
|
+
if (yerr.asymmetric){
|
127
|
+
eyl = points[i + 4];
|
128
|
+
eyu = points[i + 5];
|
129
|
+
} else eyl = points[i + 4];
|
130
|
+
} else {
|
131
|
+
exl = points[i + 2];
|
132
|
+
if (eb == 'xy')
|
133
|
+
if (yerr.asymmetric) {
|
134
|
+
eyl = points[i + 3];
|
135
|
+
eyu = points[i + 4];
|
136
|
+
} else eyl = points[i + 3];
|
137
|
+
}
|
138
|
+
// only Y
|
139
|
+
} else if (eb == 'y')
|
140
|
+
if (yerr.asymmetric) {
|
141
|
+
eyl = points[i + 2];
|
142
|
+
eyu = points[i + 3];
|
143
|
+
} else eyl = points[i + 2];
|
144
|
+
|
145
|
+
// symmetric errors?
|
146
|
+
if (exu == null) exu = exl;
|
147
|
+
if (eyu == null) eyu = eyl;
|
148
|
+
|
149
|
+
var errRanges = [exl, exu, eyl, eyu];
|
150
|
+
// nullify if not showing
|
151
|
+
if (!xerr.show){
|
152
|
+
errRanges[0] = null;
|
153
|
+
errRanges[1] = null;
|
154
|
+
}
|
155
|
+
if (!yerr.show){
|
156
|
+
errRanges[2] = null;
|
157
|
+
errRanges[3] = null;
|
158
|
+
}
|
159
|
+
return errRanges;
|
160
|
+
}
|
161
|
+
|
162
|
+
function drawSeriesErrors(plot, ctx, s){
|
163
|
+
|
164
|
+
var points = s.datapoints.points,
|
165
|
+
ps = s.datapoints.pointsize,
|
166
|
+
ax = [s.xaxis, s.yaxis],
|
167
|
+
radius = s.points.radius,
|
168
|
+
err = [s.points.xerr, s.points.yerr];
|
169
|
+
|
170
|
+
//sanity check, in case some inverted axis hack is applied to flot
|
171
|
+
var invertX = false;
|
172
|
+
if (ax[0].p2c(ax[0].max) < ax[0].p2c(ax[0].min)) {
|
173
|
+
invertX = true;
|
174
|
+
var tmp = err[0].lowerCap;
|
175
|
+
err[0].lowerCap = err[0].upperCap;
|
176
|
+
err[0].upperCap = tmp;
|
177
|
+
}
|
178
|
+
|
179
|
+
var invertY = false;
|
180
|
+
if (ax[1].p2c(ax[1].min) < ax[1].p2c(ax[1].max)) {
|
181
|
+
invertY = true;
|
182
|
+
var tmp = err[1].lowerCap;
|
183
|
+
err[1].lowerCap = err[1].upperCap;
|
184
|
+
err[1].upperCap = tmp;
|
185
|
+
}
|
186
|
+
|
187
|
+
for (var i = 0; i < s.datapoints.points.length; i += ps) {
|
188
|
+
|
189
|
+
//parse
|
190
|
+
var errRanges = parseErrors(s, i);
|
191
|
+
|
192
|
+
//cycle xerr & yerr
|
193
|
+
for (var e = 0; e < err.length; e++){
|
194
|
+
|
195
|
+
var minmax = [ax[e].min, ax[e].max];
|
196
|
+
|
197
|
+
//draw this error?
|
198
|
+
if (errRanges[e * err.length]){
|
199
|
+
|
200
|
+
//data coordinates
|
201
|
+
var x = points[i],
|
202
|
+
y = points[i + 1];
|
203
|
+
|
204
|
+
//errorbar ranges
|
205
|
+
var upper = [x, y][e] + errRanges[e * err.length + 1],
|
206
|
+
lower = [x, y][e] - errRanges[e * err.length];
|
207
|
+
|
208
|
+
//points outside of the canvas
|
209
|
+
if (err[e].err == 'x')
|
210
|
+
if (y > ax[1].max || y < ax[1].min || upper < ax[0].min || lower > ax[0].max)
|
211
|
+
continue;
|
212
|
+
if (err[e].err == 'y')
|
213
|
+
if (x > ax[0].max || x < ax[0].min || upper < ax[1].min || lower > ax[1].max)
|
214
|
+
continue;
|
215
|
+
|
216
|
+
// prevent errorbars getting out of the canvas
|
217
|
+
var drawUpper = true,
|
218
|
+
drawLower = true;
|
219
|
+
|
220
|
+
if (upper > minmax[1]) {
|
221
|
+
drawUpper = false;
|
222
|
+
upper = minmax[1];
|
223
|
+
}
|
224
|
+
if (lower < minmax[0]) {
|
225
|
+
drawLower = false;
|
226
|
+
lower = minmax[0];
|
227
|
+
}
|
228
|
+
|
229
|
+
//sanity check, in case some inverted axis hack is applied to flot
|
230
|
+
if ((err[e].err == 'x' && invertX) || (err[e].err == 'y' && invertY)) {
|
231
|
+
//swap coordinates
|
232
|
+
var tmp = lower;
|
233
|
+
lower = upper;
|
234
|
+
upper = tmp;
|
235
|
+
tmp = drawLower;
|
236
|
+
drawLower = drawUpper;
|
237
|
+
drawUpper = tmp;
|
238
|
+
tmp = minmax[0];
|
239
|
+
minmax[0] = minmax[1];
|
240
|
+
minmax[1] = tmp;
|
241
|
+
}
|
242
|
+
|
243
|
+
// convert to pixels
|
244
|
+
x = ax[0].p2c(x),
|
245
|
+
y = ax[1].p2c(y),
|
246
|
+
upper = ax[e].p2c(upper);
|
247
|
+
lower = ax[e].p2c(lower);
|
248
|
+
minmax[0] = ax[e].p2c(minmax[0]);
|
249
|
+
minmax[1] = ax[e].p2c(minmax[1]);
|
250
|
+
|
251
|
+
//same style as points by default
|
252
|
+
var lw = err[e].lineWidth ? err[e].lineWidth : s.points.lineWidth,
|
253
|
+
sw = s.points.shadowSize != null ? s.points.shadowSize : s.shadowSize;
|
254
|
+
|
255
|
+
//shadow as for points
|
256
|
+
if (lw > 0 && sw > 0) {
|
257
|
+
var w = sw / 2;
|
258
|
+
ctx.lineWidth = w;
|
259
|
+
ctx.strokeStyle = "rgba(0,0,0,0.1)";
|
260
|
+
drawError(ctx, err[e], x, y, upper, lower, drawUpper, drawLower, radius, w + w/2, minmax);
|
261
|
+
|
262
|
+
ctx.strokeStyle = "rgba(0,0,0,0.2)";
|
263
|
+
drawError(ctx, err[e], x, y, upper, lower, drawUpper, drawLower, radius, w/2, minmax);
|
264
|
+
}
|
265
|
+
|
266
|
+
ctx.strokeStyle = err[e].color? err[e].color: s.color;
|
267
|
+
ctx.lineWidth = lw;
|
268
|
+
//draw it
|
269
|
+
drawError(ctx, err[e], x, y, upper, lower, drawUpper, drawLower, radius, 0, minmax);
|
270
|
+
}
|
271
|
+
}
|
272
|
+
}
|
273
|
+
}
|
274
|
+
|
275
|
+
function drawError(ctx,err,x,y,upper,lower,drawUpper,drawLower,radius,offset,minmax){
|
276
|
+
|
277
|
+
//shadow offset
|
278
|
+
y += offset;
|
279
|
+
upper += offset;
|
280
|
+
lower += offset;
|
281
|
+
|
282
|
+
// error bar - avoid plotting over circles
|
283
|
+
if (err.err == 'x'){
|
284
|
+
if (upper > x + radius) drawPath(ctx, [[upper,y],[Math.max(x + radius,minmax[0]),y]]);
|
285
|
+
else drawUpper = false;
|
286
|
+
if (lower < x - radius) drawPath(ctx, [[Math.min(x - radius,minmax[1]),y],[lower,y]] );
|
287
|
+
else drawLower = false;
|
288
|
+
}
|
289
|
+
else {
|
290
|
+
if (upper < y - radius) drawPath(ctx, [[x,upper],[x,Math.min(y - radius,minmax[0])]] );
|
291
|
+
else drawUpper = false;
|
292
|
+
if (lower > y + radius) drawPath(ctx, [[x,Math.max(y + radius,minmax[1])],[x,lower]] );
|
293
|
+
else drawLower = false;
|
294
|
+
}
|
295
|
+
|
296
|
+
//internal radius value in errorbar, allows to plot radius 0 points and still keep proper sized caps
|
297
|
+
//this is a way to get errorbars on lines without visible connecting dots
|
298
|
+
radius = err.radius != null? err.radius: radius;
|
299
|
+
|
300
|
+
// upper cap
|
301
|
+
if (drawUpper) {
|
302
|
+
if (err.upperCap == '-'){
|
303
|
+
if (err.err=='x') drawPath(ctx, [[upper,y - radius],[upper,y + radius]] );
|
304
|
+
else drawPath(ctx, [[x - radius,upper],[x + radius,upper]] );
|
305
|
+
} else if ($.isFunction(err.upperCap)){
|
306
|
+
if (err.err=='x') err.upperCap(ctx, upper, y, radius);
|
307
|
+
else err.upperCap(ctx, x, upper, radius);
|
308
|
+
}
|
309
|
+
}
|
310
|
+
// lower cap
|
311
|
+
if (drawLower) {
|
312
|
+
if (err.lowerCap == '-'){
|
313
|
+
if (err.err=='x') drawPath(ctx, [[lower,y - radius],[lower,y + radius]] );
|
314
|
+
else drawPath(ctx, [[x - radius,lower],[x + radius,lower]] );
|
315
|
+
} else if ($.isFunction(err.lowerCap)){
|
316
|
+
if (err.err=='x') err.lowerCap(ctx, lower, y, radius);
|
317
|
+
else err.lowerCap(ctx, x, lower, radius);
|
318
|
+
}
|
319
|
+
}
|
320
|
+
}
|
321
|
+
|
322
|
+
function drawPath(ctx, pts){
|
323
|
+
ctx.beginPath();
|
324
|
+
ctx.moveTo(pts[0][0], pts[0][1]);
|
325
|
+
for (var p=1; p < pts.length; p++)
|
326
|
+
ctx.lineTo(pts[p][0], pts[p][1]);
|
327
|
+
ctx.stroke();
|
328
|
+
}
|
329
|
+
|
330
|
+
function draw(plot, ctx){
|
331
|
+
var plotOffset = plot.getPlotOffset();
|
332
|
+
|
333
|
+
ctx.save();
|
334
|
+
ctx.translate(plotOffset.left, plotOffset.top);
|
335
|
+
$.each(plot.getData(), function (i, s) {
|
336
|
+
if (s.points.errorbars && (s.points.xerr.show || s.points.yerr.show))
|
337
|
+
drawSeriesErrors(plot, ctx, s);
|
338
|
+
});
|
339
|
+
ctx.restore();
|
340
|
+
}
|
341
|
+
|
342
|
+
function init(plot) {
|
343
|
+
plot.hooks.processRawData.push(processRawData);
|
344
|
+
plot.hooks.draw.push(draw);
|
345
|
+
}
|
346
|
+
|
347
|
+
$.plot.plugins.push({
|
348
|
+
init: init,
|
349
|
+
options: options,
|
350
|
+
name: 'errorbars',
|
351
|
+
version: '1.0'
|
352
|
+
});
|
353
|
+
})(jQuery);
|
@@ -0,0 +1,63 @@
|
|
1
|
+
/* Flot plugin for plotting error bars.
|
2
|
+
|
3
|
+
Copyright (c) 2007-2013 IOLA and Ole Laursen.
|
4
|
+
Licensed under the MIT license.
|
5
|
+
|
6
|
+
Error bars are used to show standard deviation and other statistical
|
7
|
+
properties in a plot.
|
8
|
+
|
9
|
+
* Created by Rui Pereira - rui (dot) pereira (at) gmail (dot) com
|
10
|
+
|
11
|
+
This plugin allows you to plot error-bars over points. Set "errorbars" inside
|
12
|
+
the points series to the axis name over which there will be error values in
|
13
|
+
your data array (*even* if you do not intend to plot them later, by setting
|
14
|
+
"show: null" on xerr/yerr).
|
15
|
+
|
16
|
+
The plugin supports these options:
|
17
|
+
|
18
|
+
series: {
|
19
|
+
points: {
|
20
|
+
errorbars: "x" or "y" or "xy",
|
21
|
+
xerr: {
|
22
|
+
show: null/false or true,
|
23
|
+
asymmetric: null/false or true,
|
24
|
+
upperCap: null or "-" or function,
|
25
|
+
lowerCap: null or "-" or function,
|
26
|
+
color: null or color,
|
27
|
+
radius: null or number
|
28
|
+
},
|
29
|
+
yerr: { same options as xerr }
|
30
|
+
}
|
31
|
+
}
|
32
|
+
|
33
|
+
Each data point array is expected to be of the type:
|
34
|
+
|
35
|
+
"x" [ x, y, xerr ]
|
36
|
+
"y" [ x, y, yerr ]
|
37
|
+
"xy" [ x, y, xerr, yerr ]
|
38
|
+
|
39
|
+
Where xerr becomes xerr_lower,xerr_upper for the asymmetric error case, and
|
40
|
+
equivalently for yerr. Eg., a datapoint for the "xy" case with symmetric
|
41
|
+
error-bars on X and asymmetric on Y would be:
|
42
|
+
|
43
|
+
[ x, y, xerr, yerr_lower, yerr_upper ]
|
44
|
+
|
45
|
+
By default no end caps are drawn. Setting upperCap and/or lowerCap to "-" will
|
46
|
+
draw a small cap perpendicular to the error bar. They can also be set to a
|
47
|
+
user-defined drawing function, with (ctx, x, y, radius) as parameters, as eg.
|
48
|
+
|
49
|
+
function drawSemiCircle( ctx, x, y, radius ) {
|
50
|
+
ctx.beginPath();
|
51
|
+
ctx.arc( x, y, radius, 0, Math.PI, false );
|
52
|
+
ctx.moveTo( x - radius, y );
|
53
|
+
ctx.lineTo( x + radius, y );
|
54
|
+
ctx.stroke();
|
55
|
+
}
|
56
|
+
|
57
|
+
Color and radius both default to the same ones of the points series if not
|
58
|
+
set. The independent radius parameter on xerr/yerr is useful for the case when
|
59
|
+
we may want to add error-bars to a line, without showing the interconnecting
|
60
|
+
points (with radius: 0), and still showing end caps on the error-bars.
|
61
|
+
shadowSize and lineWidth are derived as well from the points series.
|
62
|
+
|
63
|
+
*/(function(e){function n(e,t,n,r){if(!t.points.errorbars)return;var i=[{x:!0,number:!0,required:!0},{y:!0,number:!0,required:!0}],s=t.points.errorbars;if(s=="x"||s=="xy")t.points.xerr.asymmetric?(i.push({x:!0,number:!0,required:!0}),i.push({x:!0,number:!0,required:!0})):i.push({x:!0,number:!0,required:!0});if(s=="y"||s=="xy")t.points.yerr.asymmetric?(i.push({y:!0,number:!0,required:!0}),i.push({y:!0,number:!0,required:!0})):i.push({y:!0,number:!0,required:!0});r.format=i}function r(e,t){var n=e.datapoints.points,r=null,i=null,s=null,o=null,u=e.points.xerr,a=e.points.yerr,f=e.points.errorbars;f=="x"||f=="xy"?u.asymmetric?(r=n[t+2],i=n[t+3],f=="xy"&&(a.asymmetric?(s=n[t+4],o=n[t+5]):s=n[t+4])):(r=n[t+2],f=="xy"&&(a.asymmetric?(s=n[t+3],o=n[t+4]):s=n[t+3])):f=="y"&&(a.asymmetric?(s=n[t+2],o=n[t+3]):s=n[t+2]),i==null&&(i=r),o==null&&(o=s);var l=[r,i,s,o];return u.show||(l[0]=null,l[1]=null),a.show||(l[2]=null,l[3]=null),l}function i(e,t,n){var i=n.datapoints.points,o=n.datapoints.pointsize,u=[n.xaxis,n.yaxis],a=n.points.radius,f=[n.points.xerr,n.points.yerr],l=!1;if(u[0].p2c(u[0].max)<u[0].p2c(u[0].min)){l=!0;var c=f[0].lowerCap;f[0].lowerCap=f[0].upperCap,f[0].upperCap=c}var h=!1;if(u[1].p2c(u[1].min)<u[1].p2c(u[1].max)){h=!0;var c=f[1].lowerCap;f[1].lowerCap=f[1].upperCap,f[1].upperCap=c}for(var p=0;p<n.datapoints.points.length;p+=o){var d=r(n,p);for(var v=0;v<f.length;v++){var m=[u[v].min,u[v].max];if(d[v*f.length]){var g=i[p],y=i[p+1],b=[g,y][v]+d[v*f.length+1],w=[g,y][v]-d[v*f.length];if(f[v].err=="x")if(y>u[1].max||y<u[1].min||b<u[0].min||w>u[0].max)continue;if(f[v].err=="y")if(g>u[0].max||g<u[0].min||b<u[1].min||w>u[1].max)continue;var E=!0,S=!0;b>m[1]&&(E=!1,b=m[1]),w<m[0]&&(S=!1,w=m[0]);if(f[v].err=="x"&&l||f[v].err=="y"&&h){var c=w;w=b,b=c,c=S,S=E,E=c,c=m[0],m[0]=m[1],m[1]=c}g=u[0].p2c(g),y=u[1].p2c(y),b=u[v].p2c(b),w=u[v].p2c(w),m[0]=u[v].p2c(m[0]),m[1]=u[v].p2c(m[1]);var x=f[v].lineWidth?f[v].lineWidth:n.points.lineWidth,T=n.points.shadowSize!=null?n.points.shadowSize:n.shadowSize;if(x>0&&T>0){var N=T/2;t.lineWidth=N,t.strokeStyle="rgba(0,0,0,0.1)",s(t,f[v],g,y,b,w,E,S,a,N+N/2,m),t.strokeStyle="rgba(0,0,0,0.2)",s(t,f[v],g,y,b,w,E,S,a,N/2,m)}t.strokeStyle=f[v].color?f[v].color:n.color,t.lineWidth=x,s(t,f[v],g,y,b,w,E,S,a,0,m)}}}}function s(t,n,r,i,s,u,a,f,l,c,h){i+=c,s+=c,u+=c,n.err=="x"?(s>r+l?o(t,[[s,i],[Math.max(r+l,h[0]),i]]):a=!1,u<r-l?o(t,[[Math.min(r-l,h[1]),i],[u,i]]):f=!1):(s<i-l?o(t,[[r,s],[r,Math.min(i-l,h[0])]]):a=!1,u>i+l?o(t,[[r,Math.max(i+l,h[1])],[r,u]]):f=!1),l=n.radius!=null?n.radius:l,a&&(n.upperCap=="-"?n.err=="x"?o(t,[[s,i-l],[s,i+l]]):o(t,[[r-l,s],[r+l,s]]):e.isFunction(n.upperCap)&&(n.err=="x"?n.upperCap(t,s,i,l):n.upperCap(t,r,s,l))),f&&(n.lowerCap=="-"?n.err=="x"?o(t,[[u,i-l],[u,i+l]]):o(t,[[r-l,u],[r+l,u]]):e.isFunction(n.lowerCap)&&(n.err=="x"?n.lowerCap(t,u,i,l):n.lowerCap(t,r,u,l)))}function o(e,t){e.beginPath(),e.moveTo(t[0][0],t[0][1]);for(var n=1;n<t.length;n++)e.lineTo(t[n][0],t[n][1]);e.stroke()}function u(t,n){var r=t.getPlotOffset();n.save(),n.translate(r.left,r.top),e.each(t.getData(),function(e,r){r.points.errorbars&&(r.points.xerr.show||r.points.yerr.show)&&i(t,n,r)}),n.restore()}function a(e){e.hooks.processRawData.push(n),e.hooks.draw.push(u)}var t={series:{points:{errorbars:null,xerr:{err:"x",show:null,asymmetric:null,upperCap:null,lowerCap:null,color:null,radius:null},yerr:{err:"y",show:null,asymmetric:null,upperCap:null,lowerCap:null,color:null,radius:null}}}};e.plot.plugins.push({init:a,options:t,name:"errorbars",version:"1.0"})})(jQuery);
|