|
1
|
|
|
/* |
|
2
|
|
|
* Jaxon Flot plugin |
|
3
|
|
|
*/ |
|
4
|
|
|
|
|
5
|
|
|
/** global: jaxon */ |
|
6
|
|
|
jaxon.dom.ready(function() { |
|
7
|
|
|
$("#flot-tooltip").remove(); |
|
8
|
|
|
$('<div id="flot-tooltip"></div>').css({ |
|
9
|
|
|
position: "absolute", |
|
10
|
|
|
display: "none", |
|
11
|
|
|
border: "1px solid #fdd", |
|
12
|
|
|
padding: "2px", |
|
13
|
|
|
"background-color": "#fee", |
|
14
|
|
|
opacity: 0.80 |
|
15
|
|
|
}).appendTo("body"); |
|
16
|
|
|
|
|
17
|
|
|
jaxon.register("flot.plot", ({ plot: { selector, graphs, size, xaxis, yaxis, options = {} } }) => { |
|
18
|
|
|
let showLabels = false; |
|
19
|
|
|
const labels = {}; |
|
20
|
|
|
const dom = jaxon.utils.dom; |
|
21
|
|
|
// Set container size |
|
22
|
|
|
if(size.width !== "") |
|
|
|
|
|
|
23
|
|
|
{ |
|
24
|
|
|
$(selector).css({width: size.width}); |
|
|
|
|
|
|
25
|
|
|
} |
|
26
|
|
|
if(size.height !== "") |
|
27
|
|
|
{ |
|
28
|
|
|
$(selector).css({height: size.height}); |
|
29
|
|
|
} |
|
30
|
|
|
|
|
31
|
|
|
const _graphs = graphs.map(g => { |
|
|
|
|
|
|
32
|
|
|
const graph = g.options || {}; |
|
33
|
|
|
graph.data = []; |
|
34
|
|
|
if(g.values.data !== null) |
|
35
|
|
|
{ |
|
36
|
|
|
graph.data = g.points.map(x => [x, g.values.data[x]]); |
|
37
|
|
|
} |
|
38
|
|
|
else if(g.values.func !== null) |
|
39
|
|
|
{ |
|
40
|
|
|
g.values.func = dom.findFunction(g.values.func); |
|
41
|
|
|
graph.data = g.points.map(x => [x, g.values.func(x)]); |
|
42
|
|
|
} |
|
43
|
|
|
if(g.labels.func !== null) |
|
44
|
|
|
{ |
|
45
|
|
|
g.labels.func = dom.findFunction(g.labels.func); |
|
46
|
|
|
} |
|
47
|
|
|
if(g.options.label !== undefined && (g.labels.data !== null || g.labels.func !== null)) |
|
48
|
|
|
{ |
|
49
|
|
|
showLabels = true; |
|
50
|
|
|
labels[g.options.label] = g.labels; |
|
51
|
|
|
} |
|
52
|
|
|
return graph; |
|
53
|
|
|
}); |
|
54
|
|
|
|
|
55
|
|
|
// Setting ticks |
|
56
|
|
|
if(xaxis.points.length > 0) |
|
|
|
|
|
|
57
|
|
|
{ |
|
58
|
|
|
let ticks = []; |
|
59
|
|
|
if(xaxis.labels.data !== null) |
|
60
|
|
|
{ |
|
61
|
|
|
ticks = xaxis.points.map(point => [point, xaxis.labels.data[point]]); |
|
|
|
|
|
|
62
|
|
|
} |
|
63
|
|
|
else if(xaxis.labels.func !== null) |
|
64
|
|
|
{ |
|
65
|
|
|
xaxis.labels.func = dom.findFunction(xaxis.labels.func); |
|
66
|
|
|
ticks = xaxis.points.map(point => [point, xaxis.labels.func(point)]); |
|
|
|
|
|
|
67
|
|
|
} |
|
68
|
|
|
if(ticks.length > 0) |
|
69
|
|
|
{ |
|
70
|
|
|
options.xaxis = {ticks: ticks}; |
|
|
|
|
|
|
71
|
|
|
} |
|
72
|
|
|
} |
|
73
|
|
|
/*if(yaxis.points.length > 0) |
|
74
|
|
|
{ |
|
75
|
|
|
}*/ |
|
76
|
|
|
|
|
77
|
|
|
if(showLabels) |
|
78
|
|
|
{ |
|
79
|
|
|
options.grid = {hoverable: true}; |
|
80
|
|
|
} |
|
81
|
|
|
$.plot(selector, _graphs, options); |
|
82
|
|
|
|
|
83
|
|
|
// Labels |
|
84
|
|
|
if(showLabels) |
|
85
|
|
|
{ |
|
86
|
|
|
$(selector).bind("plothover", function (event, pos, item) { |
|
87
|
|
|
if(!item) |
|
88
|
|
|
{ |
|
89
|
|
|
$("#flot-tooltip").hide(); |
|
90
|
|
|
return; |
|
91
|
|
|
} |
|
92
|
|
|
|
|
93
|
|
|
const series = item.series.label; |
|
94
|
|
|
const x = item.datapoint[0]; // item.datapoint[0].toFixed(2); |
|
95
|
|
|
const y = item.datapoint[1]; // item.datapoint[1].toFixed(2); |
|
96
|
|
|
let tooltip = ""; |
|
97
|
|
|
if(labels[series] !== undefined) |
|
98
|
|
|
{ |
|
99
|
|
|
const _labels = labels[series]; |
|
100
|
|
|
if(_labels.data !== null && _labels.data[x] !== undefined) |
|
101
|
|
|
{ |
|
102
|
|
|
tooltip = _labels.data[x]; |
|
103
|
|
|
} |
|
104
|
|
|
else if(_labels.func !== null) |
|
105
|
|
|
{ |
|
106
|
|
|
tooltip = _labels.func(series, x, y); |
|
107
|
|
|
} |
|
108
|
|
|
} |
|
109
|
|
|
if((tooltip)) |
|
110
|
|
|
{ |
|
111
|
|
|
$("#flot-tooltip").html(tooltip).css({top: item.pageY+5, left: item.pageX+5}).fadeIn(200); |
|
112
|
|
|
} |
|
113
|
|
|
}); |
|
114
|
|
|
} |
|
115
|
|
|
return true; |
|
116
|
|
|
}); |
|
117
|
|
|
}); |
|
118
|
|
|
|
This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed.
To learn more about declaring variables in Javascript, see the MDN.