mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Graph: refactoring some stuff with legend values
This commit is contained in:
@@ -7,9 +7,10 @@ function (_, kbn) {
|
||||
|
||||
function TimeSeries(opts) {
|
||||
this.datapoints = opts.datapoints;
|
||||
this.info = opts.info;
|
||||
this.label = opts.info.alias;
|
||||
this.id = opts.info.alias;
|
||||
this.label = opts.alias;
|
||||
this.id = opts.alias;
|
||||
this.alias = opts.alias;
|
||||
this.color = opts.color;
|
||||
this.valueFormater = kbn.valueFormats.none;
|
||||
this.stats = {};
|
||||
}
|
||||
@@ -33,13 +34,13 @@ function (_, kbn) {
|
||||
this.lines = {};
|
||||
this.points = {};
|
||||
this.bars = {};
|
||||
this.info.yaxis = 1;
|
||||
this.yaxis = 1;
|
||||
this.zindex = 0;
|
||||
delete this.stack;
|
||||
|
||||
for (var i = 0; i < overrides.length; i++) {
|
||||
var override = overrides[i];
|
||||
if (!matchSeriesOverride(override.alias, this.info.alias)) {
|
||||
if (!matchSeriesOverride(override.alias, this.alias)) {
|
||||
continue;
|
||||
}
|
||||
if (override.lines !== void 0) { this.lines.show = override.lines; }
|
||||
@@ -54,7 +55,7 @@ function (_, kbn) {
|
||||
if (override.fillBelowTo !== void 0) { this.fillBelowTo = override.fillBelowTo; }
|
||||
|
||||
if (override.yaxis !== void 0) {
|
||||
this.info.yaxis = override.yaxis;
|
||||
this.yaxis = override.yaxis;
|
||||
}
|
||||
}
|
||||
};
|
||||
@@ -62,9 +63,6 @@ function (_, kbn) {
|
||||
TimeSeries.prototype.getFlotPairs = function (fillStyle) {
|
||||
var result = [];
|
||||
|
||||
this.color = this.info.color;
|
||||
this.yaxis = this.info.yaxis;
|
||||
|
||||
this.stats.total = 0;
|
||||
this.stats.max = Number.MIN_VALUE;
|
||||
this.stats.min = Number.MAX_VALUE;
|
||||
@@ -123,12 +121,6 @@ function (_, kbn) {
|
||||
this.valueFormater = formater;
|
||||
this.decimals = decimals;
|
||||
this.scaledDecimals = scaledDecimals;
|
||||
|
||||
this.info.avg = this.formatValue(this.stats.avg);
|
||||
this.info.current = this.formatValue(this.stats.current);
|
||||
this.info.min = this.formatValue(this.stats.min);
|
||||
this.info.max = this.formatValue(this.stats.max);
|
||||
this.info.total = this.formatValue(this.stats.total);
|
||||
};
|
||||
|
||||
TimeSeries.prototype.formatValue = function(value) {
|
||||
|
||||
@@ -175,7 +175,7 @@ function (angular, $, kbn, moment, _, GraphTooltip) {
|
||||
series.data = series.getFlotPairs(panel.nullPointMode, panel.y_formats);
|
||||
|
||||
// if hidden remove points and disable stack
|
||||
if (scope.hiddenSeries[series.info.alias]) {
|
||||
if (scope.hiddenSeries[series.alias]) {
|
||||
series.data = [];
|
||||
series.stack = false;
|
||||
}
|
||||
|
||||
@@ -36,7 +36,7 @@ function (angular, app, _, kbn, $) {
|
||||
function openColorSelector(e) {
|
||||
var el = $(e.currentTarget);
|
||||
var index = getSeriesIndexForElement(el);
|
||||
var seriesInfo = data[index].info;
|
||||
var seriesInfo = data[index];
|
||||
var popoverScope = scope.$new();
|
||||
popoverScope.series = seriesInfo;
|
||||
popoverSrv.show({
|
||||
@@ -49,7 +49,7 @@ function (angular, app, _, kbn, $) {
|
||||
function toggleSeries(e) {
|
||||
var el = $(e.currentTarget);
|
||||
var index = getSeriesIndexForElement(el);
|
||||
var seriesInfo = data[index].info;
|
||||
var seriesInfo = data[index];
|
||||
scope.toggleSeries(seriesInfo, e);
|
||||
}
|
||||
|
||||
@@ -83,8 +83,8 @@ function (angular, app, _, kbn, $) {
|
||||
for (i = 0; i < data.length; i++) {
|
||||
var series = data[i];
|
||||
var html = '<div class="graph-legend-series';
|
||||
if (series.info.yaxis === 2) { html += ' pull-right'; }
|
||||
if (scope.hiddenSeries[series.label]) { html += ' graph-legend-series-hidden'; }
|
||||
if (series.yaxis === 2) { html += ' pull-right'; }
|
||||
if (scope.hiddenSeries[series.alias]) { html += ' graph-legend-series-hidden'; }
|
||||
html += '" data-series-index="' + i + '">';
|
||||
html += '<div class="graph-legend-icon">';
|
||||
html += '<i class="icon-minus pointer" style="color:' + series.color + '"></i>';
|
||||
@@ -94,12 +94,18 @@ function (angular, app, _, kbn, $) {
|
||||
html += '<a>' + series.label + '</a>';
|
||||
html += '</div>';
|
||||
|
||||
var avg = series.formatValue(series.stats.avg);
|
||||
var current = series.formatValue(series.stats.current);
|
||||
var min = series.formatValue(series.stats.min);
|
||||
var max = series.formatValue(series.stats.max);
|
||||
var total = series.formatValue(series.stats.total);
|
||||
|
||||
if (panel.legend.values) {
|
||||
if (panel.legend.min) { html += '<div class="graph-legend-value min small">' + series.info.min + '</div>'; }
|
||||
if (panel.legend.max) { html += '<div class="graph-legend-value max small">' + series.info.max + '</div>'; }
|
||||
if (panel.legend.avg) { html += '<div class="graph-legend-value avg small">' + series.info.avg + '</div>'; }
|
||||
if (panel.legend.current) { html += '<div class="graph-legend-value current small">' + series.info.current + '</div>'; }
|
||||
if (panel.legend.total) { html += '<div class="graph-legend-value total small">' + series.info.total + '</div>'; }
|
||||
if (panel.legend.min) { html += '<div class="graph-legend-value min small">' + min + '</div>'; }
|
||||
if (panel.legend.max) { html += '<div class="graph-legend-value max small">' + max + '</div>'; }
|
||||
if (panel.legend.avg) { html += '<div class="graph-legend-value avg small">' + avg + '</div>'; }
|
||||
if (panel.legend.current) { html += '<div class="graph-legend-value current small">' + current + '</div>'; }
|
||||
if (panel.legend.total) { html += '<div class="graph-legend-value total small">' + total + '</div>'; }
|
||||
}
|
||||
|
||||
html += '</div>';
|
||||
|
||||
@@ -112,6 +112,7 @@ function (angular, app, $, _, kbn, moment, TimeSeries, PanelMeta) {
|
||||
_.defaults($scope.panel.legend, _d.legend);
|
||||
|
||||
$scope.hiddenSeries = {};
|
||||
$scope.seriesList = [];
|
||||
|
||||
$scope.updateTimeRange = function () {
|
||||
$scope.range = timeSrv.timeRange();
|
||||
@@ -145,6 +146,7 @@ function (angular, app, $, _, kbn, moment, TimeSeries, PanelMeta) {
|
||||
$scope.panelMeta.loading = false;
|
||||
$scope.panelMeta.error = err.message || "Timeseries data request error";
|
||||
$scope.inspector.error = err;
|
||||
$scope.seriesList = [];
|
||||
$scope.render([]);
|
||||
});
|
||||
};
|
||||
@@ -162,16 +164,16 @@ function (angular, app, $, _, kbn, moment, TimeSeries, PanelMeta) {
|
||||
$scope.datapointsCount = 0;
|
||||
$scope.datapointsOutside = false;
|
||||
|
||||
var data = _.map(results.data, $scope.seriesHandler);
|
||||
$scope.seriesList = _.map(results.data, $scope.seriesHandler);
|
||||
|
||||
$scope.datapointsWarning = $scope.datapointsCount === 0 || $scope.datapointsOutside;
|
||||
|
||||
$scope.annotationsPromise
|
||||
.then(function(annotations) {
|
||||
data.annotations = annotations;
|
||||
$scope.render(data);
|
||||
$scope.seriesList.annotations = annotations;
|
||||
$scope.render($scope.seriesList);
|
||||
}, function() {
|
||||
$scope.render(data);
|
||||
$scope.render($scope.seriesList);
|
||||
});
|
||||
};
|
||||
|
||||
@@ -182,7 +184,8 @@ function (angular, app, $, _, kbn, moment, TimeSeries, PanelMeta) {
|
||||
|
||||
var series = new TimeSeries({
|
||||
datapoints: datapoints,
|
||||
info: {alias: alias, color: color},
|
||||
alias: alias,
|
||||
color: color,
|
||||
});
|
||||
|
||||
if (datapoints && datapoints.length > 0) {
|
||||
@@ -231,7 +234,7 @@ function (angular, app, $, _, kbn, moment, TimeSeries, PanelMeta) {
|
||||
}
|
||||
|
||||
// check if every other series is hidden
|
||||
var alreadyExclusive = _.every($scope.legend, function(value) {
|
||||
var alreadyExclusive = _.every($scope.seriesList, function(value) {
|
||||
if (value.alias === serie.alias) {
|
||||
return true;
|
||||
}
|
||||
@@ -241,13 +244,13 @@ function (angular, app, $, _, kbn, moment, TimeSeries, PanelMeta) {
|
||||
|
||||
if (alreadyExclusive) {
|
||||
// remove all hidden series
|
||||
_.each($scope.legend, function(value) {
|
||||
_.each($scope.seriesList, function(value) {
|
||||
delete $scope.hiddenSeries[value.alias];
|
||||
});
|
||||
}
|
||||
else {
|
||||
// hide all but this serie
|
||||
_.each($scope.legend, function(value) {
|
||||
_.each($scope.seriesList, function(value) {
|
||||
if (value.alias === serie.alias) {
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -47,11 +47,11 @@ define([
|
||||
ctx.data = [];
|
||||
ctx.data.push(new TimeSeries({
|
||||
datapoints: [[1,1],[2,2]],
|
||||
info: { alias: 'series1', enable: true }
|
||||
alias: 'series1'
|
||||
}));
|
||||
ctx.data.push(new TimeSeries({
|
||||
datapoints: [[1,1],[2,2]],
|
||||
info: { alias: 'series2', enable: true }
|
||||
alias: 'series2'
|
||||
}));
|
||||
|
||||
setupFunc(scope, ctx.data);
|
||||
@@ -131,7 +131,7 @@ define([
|
||||
scope.panel.bars = true;
|
||||
data[0] = new TimeSeries({
|
||||
datapoints: [[1,10],[2,20]],
|
||||
info: { alias: 'series1', enable: true }
|
||||
alias: 'series1',
|
||||
});
|
||||
});
|
||||
|
||||
@@ -148,7 +148,7 @@ define([
|
||||
{ alias: 'test', fill: 0, points: true }
|
||||
];
|
||||
|
||||
data[1].info.alias = 'test';
|
||||
data[1].alias = 'test';
|
||||
});
|
||||
|
||||
it('should match second series and fill zero, and enable points', function() {
|
||||
@@ -164,8 +164,8 @@ define([
|
||||
});
|
||||
|
||||
it('should move zindex 2 last', function() {
|
||||
expect(ctx.plotData[0].info.alias).to.be('series2');
|
||||
expect(ctx.plotData[1].info.alias).to.be('series1');
|
||||
expect(ctx.plotData[0].alias).to.be('series2');
|
||||
expect(ctx.plotData[1].alias).to.be('series1');
|
||||
});
|
||||
});
|
||||
|
||||
@@ -175,7 +175,7 @@ define([
|
||||
});
|
||||
|
||||
it('should remove datapoints and disable stack', function() {
|
||||
expect(ctx.plotData[0].info.alias).to.be('series1');
|
||||
expect(ctx.plotData[0].alias).to.be('series1');
|
||||
expect(ctx.plotData[1].data.length).to.be(0);
|
||||
expect(ctx.plotData[1].stack).to.be(false);
|
||||
});
|
||||
|
||||
@@ -7,7 +7,7 @@ define([
|
||||
var points, series;
|
||||
var yAxisFormats = ['short', 'ms'];
|
||||
var testData = {
|
||||
info: { alias: 'test' },
|
||||
alias: 'test',
|
||||
datapoints: [
|
||||
[1,2],[null,3],[10,4],[8,5]
|
||||
]
|
||||
@@ -36,7 +36,7 @@ define([
|
||||
|
||||
describe('fill & points', function() {
|
||||
beforeEach(function() {
|
||||
series.info.alias = 'test';
|
||||
series.alias = 'test';
|
||||
series.applySeriesOverrides([{ alias: 'test', fill: 0, points: true }]);
|
||||
});
|
||||
|
||||
@@ -48,7 +48,7 @@ define([
|
||||
|
||||
describe('series option overrides, bars, true & lines false', function() {
|
||||
beforeEach(function() {
|
||||
series.info.alias = 'test';
|
||||
series.alias = 'test';
|
||||
series.applySeriesOverrides([{ alias: 'test', bars: true, lines: false }]);
|
||||
});
|
||||
|
||||
@@ -60,7 +60,7 @@ define([
|
||||
|
||||
describe('series option overrides, linewidth, stack', function() {
|
||||
beforeEach(function() {
|
||||
series.info.alias = 'test';
|
||||
series.alias = 'test';
|
||||
series.applySeriesOverrides([{ alias: 'test', linewidth: 5, stack: false }]);
|
||||
});
|
||||
|
||||
@@ -72,7 +72,7 @@ define([
|
||||
|
||||
describe('series option overrides, fill below to', function() {
|
||||
beforeEach(function() {
|
||||
series.info.alias = 'test';
|
||||
series.alias = 'test';
|
||||
series.applySeriesOverrides([{ alias: 'test', fillBelowTo: 'min' }]);
|
||||
});
|
||||
|
||||
@@ -83,7 +83,7 @@ define([
|
||||
|
||||
describe('series option overrides, pointradius, steppedLine', function() {
|
||||
beforeEach(function() {
|
||||
series.info.alias = 'test';
|
||||
series.alias = 'test';
|
||||
series.applySeriesOverrides([{ alias: 'test', pointradius: 5, steppedLine: true }]);
|
||||
});
|
||||
|
||||
@@ -95,7 +95,7 @@ define([
|
||||
|
||||
describe('override match on regex', function() {
|
||||
beforeEach(function() {
|
||||
series.info.alias = 'test_01';
|
||||
series.alias = 'test_01';
|
||||
series.applySeriesOverrides([{ alias: '/.*01/', lines: false }]);
|
||||
});
|
||||
|
||||
@@ -106,12 +106,12 @@ define([
|
||||
|
||||
describe('override series y-axis, and z-index', function() {
|
||||
beforeEach(function() {
|
||||
series.info.alias = 'test';
|
||||
series.alias = 'test';
|
||||
series.applySeriesOverrides([{ alias: 'test', yaxis: 2, zindex: 2 }]);
|
||||
});
|
||||
|
||||
it('should set yaxis', function() {
|
||||
expect(series.info.yaxis).to.be(2);
|
||||
expect(series.yaxis).to.be(2);
|
||||
});
|
||||
|
||||
it('should set zindex', function() {
|
||||
|
||||
Reference in New Issue
Block a user