Skip to content

Commit 9112d10

Browse files
fookerfooker
committed
BSHIFT-12: Adds support for VDEF statements
VDEFs are now parsed and calculated inside backshift. The obsolete syntax for (G)PRINT statements is still supported but implementation has changed to use an interim VDEF. This requires an update to flot-legend, as the calculated values must be passed to the legend for rendering.
1 parent 6abb93a commit 9112d10

16 files changed

+812
-77
lines changed

‎Gruntfile.js

+2
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ module.exports = function (grunt) {
1010
'src/Backshift.Utilities.Url.js',
1111
'src/Backshift.Utilities.RpnToJexlConverter.js',
1212
'src/Backshift.Utilities.RpnEvaluator.js',
13+
'src/Backshift.Utilities.Consolidator.js',
1314
'src/Backshift.Utilities.RrdGraphVisitor.js',
1415
'src/Backshift.Utilities.RrdGraphConverter.js',
1516
'src/Backshift.Graph.js',
@@ -34,6 +35,7 @@ module.exports = function (grunt) {
3435
'src/Backshift.Class.Configurable.js',
3536
'src/Backshift.Utilities.RpnToJexlConverter.js',
3637
'src/Backshift.Utilities.RpnEvaluator.js',
38+
'src/Backshift.Utilities.Consolidator.js',
3739
'src/Backshift.Utilities.RrdGraphVisitor.js',
3840
'src/Backshift.Utilities.RrdGraphConverter.js',
3941
'src/Backshift.Graph.js',

‎bower.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818
"flot": "~0.8.3",
1919
"flot-axislabels": "https://github.com/j-white/flot-axislabels.git#0d6ae9a79338",
2020
"flot.tooltip": "~0.8.5",
21-
"flot-legend": "https://github.com/j-white/flot-legend.git#v1.0.1",
21+
"flot-legend": "https://github.com/j-white/flot-legend.git#v2.0.0",
2222
"flot-saveas": "https://github.com/j-white/flot-saveas.git#v1.0.0",
2323
"flot-datatable": "https://github.com/j-white/flot-datatable.git#v1.0.6",
2424
"flot-navigate": "https://github.com/j-white/flot-navigate.git#v1.3-CUSTOM"

‎examples/flot-static.html

+71-26
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@
2424
<script src="../src/Backshift.Math.js"></script>
2525
<script src="../src/Backshift.Stats.js"></script>
2626
<script src="../src/Backshift.Utilities.Url.js"></script>
27+
<script src="../src/Backshift.Utilities.Consolidator.js"></script>
2728
<script src="../src/Backshift.DataSource.js"></script>
2829
<script src="../src/Backshift.DataSource.SineWave.js"></script>
2930
<script src="../src/Backshift.Graph.js"></script>
@@ -53,6 +54,8 @@
5354
]
5455
});
5556

57+
var consolidator = new Backshift.Utilities.Consolidator();
58+
5659
var flotGraph = new Backshift.Graph.Flot({
5760
element: document.querySelector("#chart-graph"),
5861
start: 0,
@@ -77,54 +80,96 @@
7780
color: "#ff0000"
7881
}
7982
],
83+
values: [
84+
{
85+
name: 'wave1_avg',
86+
expression: consolidator.average('wave1')
87+
},
88+
{
89+
name: 'wave1_min',
90+
expression: consolidator.minimum('wave1')
91+
},
92+
{
93+
name: 'wave1_max',
94+
expression: consolidator.maximum('wave1')
95+
},
96+
{
97+
name: 'wave1_lst',
98+
expression: consolidator.last('wave1')
99+
},
100+
{
101+
name: 'wave1_p95',
102+
expression: consolidator.percent('wave1', 95.0)
103+
},
104+
{
105+
name: 'wave2_avg',
106+
expression: consolidator.average('wave2')
107+
},
108+
{
109+
name: 'wave2_min',
110+
expression: consolidator.minimum('wave2')
111+
},
112+
{
113+
name: 'wave2_max',
114+
expression: consolidator.maximum('wave2')
115+
},
116+
{
117+
name: 'wave2_lst',
118+
expression: consolidator.last('wave2')
119+
},
120+
{
121+
name: 'wave2_p95',
122+
expression: consolidator.percent('wave2', 95.0)
123+
},
124+
],
80125
printStatements: [
81126
{
82127
metric: 'wave1',
83-
value: '%g Source #1 '
128+
format: '%g Source #1 '
84129
},
85130
{
86-
metric: 'wave1',
87-
aggregation: 'AVERAGE',
88-
value: 'Avg: %8.2lf %s'
131+
metric: 'wave1_avg',
132+
format: 'Avg: %8.2lf %s'
89133
},
90134
{
91-
metric: 'wave1',
92-
aggregation: 'MIN',
93-
value: 'Min: %8.2lf %s'
135+
metric: 'wave1_min',
136+
format: 'Min: %8.2lf %s'
94137
},
95138
{
96-
metric: 'wave1',
97-
aggregation: 'MAX',
98-
value: 'Max: %8.2lf %s'
139+
metric: 'wave1_max',
140+
format: 'Max: %8.2lf %s'
99141
},
100142
{
101-
metric: 'wave1',
102-
aggregation: 'LAST',
103-
value: 'Last: %8.2lf %s \\n'
143+
metric: 'wave1_lst',
144+
format: 'Last: %8.2lf %s'
104145
},
105146
{
106-
metric: 'wave2',
107-
value: '%g Source #2 '
147+
metric: 'wave1_p95',
148+
format: '95%: %8.2lf %s \\n'
108149
},
109150
{
110151
metric: 'wave2',
111-
aggregation: 'AVERAGE',
112-
value: 'Avg: %8.2lf %s'
152+
format: '%g Source #2 '
113153
},
114154
{
115-
metric: 'wave2',
116-
aggregation: 'MIN',
117-
value: 'Min: %8.2lf %s'
155+
metric: 'wave2_avg',
156+
format: 'Avg: %8.2lf %s'
118157
},
119158
{
120-
metric: 'wave2',
121-
aggregation: 'MAX',
122-
value: 'Max: %8.2lf %s'
159+
metric: 'wave2_min',
160+
format: 'Min: %8.2lf %s'
123161
},
124162
{
125-
metric: 'wave2',
126-
aggregation: 'LAST',
127-
value: 'Last: %8.2lf %s'
163+
metric: 'wave2_max',
164+
format: 'Max: %8.2lf %s'
165+
},
166+
{
167+
metric: 'wave2_lst',
168+
format: 'Last: %8.2lf %s'
169+
},
170+
{
171+
metric: 'wave2_p95',
172+
format: '95%: %8.2lf %s'
128173
}
129174
],
130175
},

‎examples/opennms-datasource.html

+4-3
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
<script src="../src/Backshift.Stats.js"></script>
1212
<script src="../src/Backshift.Utilities.Url.js"></script>
1313
<script src="../src/Backshift.Utilities.RpnToJexlConverter.js"></script>
14+
<script src="../src/Backshift.Utilities.Consolidator.js"></script>
1415
<script src="../src/Backshift.Utilities.RrdGraphVisitor.js"></script>
1516
<script src="../src/Backshift.Utilities.RrdGraphConverter.js"></script>
1617
<script src="../src/Backshift.DataSource.js"></script>
@@ -33,15 +34,15 @@ <h2>OpenNMS datasource query results:</h2>
3334

3435
<script type="text/javascript">
3536
var onmsHost = "demo.opennms.org",
36-
onmsPort = 80,
37+
onmsPort = 443,
3738
onmsUsername = 'demo',
3839
onmsPassword = 'demo',
3940
end = Date.now(),
4041
start = end - (8 * 60 * 60 * 1000), // 8 hours ago
4142
resolution = 100;
4243

4344
function getBaseHref() {
44-
return "http://" + onmsHost + ":" + onmsPort;
45+
return "https://" + onmsHost + ":" + onmsPort;
4546
}
4647

4748
$(document).ready(function () {
@@ -70,4 +71,4 @@ <h2>OpenNMS datasource query results:</h2>
7071
});
7172
</script>
7273
</body>
73-
</html>
74+
</html>

‎examples/opennms-forecasting.html

+5-4
Original file line numberDiff line numberDiff line change
@@ -22,17 +22,18 @@
2222
<script src="../src/Backshift.Stats.js"></script>
2323
<script src="../src/Backshift.Utilities.Url.js"></script>
2424
<script src="../src/Backshift.Utilities.RpnToJexlConverter.js"></script>
25+
<script src="../src/Backshift.Utilities.Consolidator.js"></script>
2526
<script src="../src/Backshift.Utilities.RrdGraphVisitor.js"></script>
2627
<script src="../src/Backshift.Utilities.RrdGraphConverter.js"></script>
2728
<script src="../src/Backshift.DataSource.js"></script>
2829
<script src="../src/Backshift.DataSource.OpenNMS.js"></script>
2930
<script src="../src/Backshift.Graph.js"></script>
3031
<script src="../src/Backshift.Graph.Flot.js"></script>
3132

32-
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
33-
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
34-
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
35-
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
33+
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
34+
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
35+
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
36+
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
3637

3738
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.0/angular.min.js"></script>
3839
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore.js"></script>

‎examples/opennms-graphs.html

+8-7
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@
2929
<script src="../src/Backshift.Stats.js"></script>
3030
<script src="../src/Backshift.Utilities.Url.js"></script>
3131
<script src="../src/Backshift.Utilities.RpnToJexlConverter.js"></script>
32+
<script src="../src/Backshift.Utilities.Consolidator.js"></script>
3233
<script src="../src/Backshift.Utilities.RrdGraphVisitor.js"></script>
3334
<script src="../src/Backshift.Utilities.RrdGraphConverter.js"></script>
3435
<script src="../src/Backshift.DataSource.js"></script>
@@ -40,10 +41,10 @@
4041
-->
4142
<script src="../src/Backshift.Graph.Flot.js"></script>
4243

43-
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
44-
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
45-
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
46-
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
44+
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
45+
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
46+
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
47+
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
4748
<!--
4849
<link rel="stylesheet" href="../bower_components/c3/c3.min.css">
4950
<link rel="stylesheet" href="../bower_components/dcjs/dc.css">
@@ -173,14 +174,14 @@ <h4 class="text-center">RRD</h4>
173174

174175
<script type="text/javascript">
175176
var onmsHost = "demo.opennms.org",
176-
onmsPort = 80,
177+
onmsPort = 443,
177178
onmsUsername = 'demo',
178179
onmsPassword = 'demo',
179180
end = Date.now(),
180181
start = end - (12*60*60*1000); // (30*24*60*60*1000); // 30 days ago
181182

182183
function getBaseHref() {
183-
return "http://" + onmsHost + ":" + onmsPort;
184+
return "https://" + onmsHost + ":" + onmsPort;
184185
}
185186

186187
$(document).ready(function () {
@@ -236,7 +237,7 @@ <h4 class="text-center">RRD</h4>
236237
}, 1000);
237238

238239
// Pull in the RRD graph for comparison
239-
var rrdGraphImageUrl = "http://" + onmsUsername + ":" + onmsPassword + "@" + onmsHost + ":" + onmsPort + "/opennms/graph/graph.png?resourceId=" + resource +
240+
var rrdGraphImageUrl = "https://" + onmsUsername + ":" + onmsPassword + "@" + onmsHost + ":" + onmsPort + "/opennms/graph/graph.png?resourceId=" + resource +
240241
"&report=" + encodeURIComponent(report) +
241242
"&start=" + start +
242243
"&end=" + end +

‎examples/opennms-nrtg.html

+5-4
Original file line numberDiff line numberDiff line change
@@ -23,17 +23,18 @@
2323
<script src="../src/Backshift.Utilities.Url.js"></script>
2424
<script src="../src/Backshift.Utilities.RpnEvaluator.js"></script>
2525
<script src="../src/Backshift.Utilities.RpnToJexlConverter.js"></script>
26+
<script src="../src/Backshift.Utilities.Consolidator.js"></script>
2627
<script src="../src/Backshift.Utilities.RrdGraphVisitor.js"></script>
2728
<script src="../src/Backshift.Utilities.RrdGraphConverter.js"></script>
2829
<script src="../src/Backshift.DataSource.js"></script>
2930
<script src="../src/Backshift.DataSource.NRTG.js"></script>
3031
<script src="../src/Backshift.Graph.js"></script>
3132
<script src="../src/Backshift.Graph.Flot.js"></script>
3233

33-
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
34-
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
35-
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
36-
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
34+
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
35+
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
36+
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
37+
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
3738

3839
<style>
3940
.row {

‎examples/sine-wave.html

+1
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@
1818
<script src="../src/Backshift.Math.js"></script>
1919
<script src="../src/Backshift.Stats.js"></script>
2020
<script src="../src/Backshift.Utilities.Url.js"></script>
21+
<script src="../src/Backshift.Utilities.Consolidator.js"></script>
2122
<script src="../src/Backshift.DataSource.js"></script>
2223
<script src="../src/Backshift.DataSource.SineWave.js"></script>
2324
<script src="../src/Backshift.Graph.js"></script>

‎karma.conf.js

+1
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@ module.exports = function(config) {
3535
'src/Backshift.Utilities.Url.js',
3636
'src/Backshift.Utilities.RpnToJexlConverter.js',
3737
'src/Backshift.Utilities.RpnEvaluator.js',
38+
'src/Backshift.Utilities.Consolidator.js',
3839
'src/Backshift.Utilities.RrdGraphVisitor.js',
3940
'src/Backshift.Utilities.RrdGraphConverter.js',
4041
'src/Backshift.Graph.js',

‎src/Backshift.Graph.Flot.js

+27-2
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44

55
Backshift.namespace('Backshift.Graph.Flot');
66

7-
/** Renders the graoh using Flot */
7+
/** Renders the graph using Flot */
88
Backshift.Graph.Flot = Backshift.Class.create(Backshift.Graph, {
99

1010
defaults: function ($super) {
@@ -179,6 +179,31 @@ Backshift.Graph.Flot = Backshift.Class.create(Backshift.Graph, {
179179

180180
var yaxisTickFormat = d3.format(".3s");
181181

182+
var legendStatements = [];
183+
for (i = 0; i < self.model.printStatements.length; i++) {
184+
var printStatement = self.model.printStatements[i];
185+
186+
if (printStatement.metric in this._values) {
187+
// Print statements referencing a VDEF
188+
var value = this._values[printStatement.metric];
189+
legendStatements.push({
190+
metric: value.metricName,
191+
value: value.value[1],
192+
timestamp: value.value[0],
193+
format: printStatement.format,
194+
});
195+
196+
} else if (results) {
197+
// Print statements referencing a series without a concrete value (used for %g)
198+
legendStatements.push({
199+
metric: printStatement.metric,
200+
value: NaN,
201+
timestamp: undefined,
202+
format: printStatement.format,
203+
});
204+
}
205+
}
206+
182207
var options = {
183208
canvas: true,
184209
title: self.title || '',
@@ -229,7 +254,7 @@ Backshift.Graph.Flot = Backshift.Class.create(Backshift.Graph, {
229254
},
230255
legend: {
231256
show: false,
232-
statements: self.model.printStatements
257+
statements: legendStatements
233258
},
234259
hiddenSeries: this.hiddenFlotSeries,
235260
tooltip: {

0 commit comments

Comments
 (0)