Limit number of merics in prometheus UI (#5139)

Signed-off-by: Vishnunarayan K I <appukuttancr@gmail.com>
This commit is contained in:
Vishnunarayan K I 2019-01-31 22:33:50 +05:30 committed by Julius Volz
parent 50e1228f88
commit 108b9b0e5f
4 changed files with 47 additions and 11 deletions

File diff suppressed because one or more lines are too long

View file

@ -138,7 +138,7 @@ input[name="end_input"], input[name="range_input"] {
margin-right: -1px;
}
.error {
.error, .warning {
padding: 5px;
margin: 2px;
}
@ -196,3 +196,8 @@ input[name="end_input"], input[name="range_input"] {
background-color: #222222;
border-radius: 0;
}
ul.typeahead.dropdown-menu {
max-height: 400px;
overflow: auto;
}

View file

@ -20,6 +20,7 @@
<div class="row">
<div class="col-lg-12">
<div class="error alert alert-danger"></div>
<div class="warning alert alert-warning"></div>
</div>
</div>

View file

@ -107,6 +107,7 @@ Prometheus.Graph.prototype.initialize = function() {
})
self.error = graphWrapper.find(".error").hide();
self.warning = graphWrapper.find(".warning").hide();
self.graphArea = graphWrapper.find(".graph_area");
self.graph = self.graphArea.find(".graph");
self.yAxis = self.graphArea.find(".y_axis");
@ -237,7 +238,7 @@ Prometheus.Graph.prototype.checkTimeDrift = function() {
var diff = Math.abs(browserTime - serverTime);
if (diff >= 30) {
$("#graph_wrapper0").prepend(
this.showWarning(
"<div class=\"alert alert-warning\"><strong>Warning!</strong> Detected " +
diff.toFixed(2) +
" seconds time difference between your browser and the server. Prometheus relies on accurate time and time drift might cause unexpected query results.</div>"
@ -286,7 +287,7 @@ Prometheus.Graph.prototype.initTypeahead = function(self) {
self.expr.typeahead({
autoSelect: false,
source: source,
items: "all",
items: 1000,
matcher: function (item) {
// If we have result for current query, skip
if (self.fuzzyResult.query !== this.query) {
@ -462,6 +463,7 @@ Prometheus.Graph.prototype.decreaseMoment = function() {
Prometheus.Graph.prototype.submitQuery = function() {
var self = this;
self.clearError();
self.clearWarning();
if (!self.expr.val()) {
return;
}
@ -546,12 +548,24 @@ Prometheus.Graph.prototype.showError = function(msg) {
self.error.show();
};
Prometheus.Graph.prototype.clearError = function(msg) {
Prometheus.Graph.prototype.clearError = function() {
var self = this;
self.error.text('');
self.error.hide();
};
Prometheus.Graph.prototype.showWarning = function(msg) {
var self = this;
self.warning.html(msg);
self.warning.show();
};
Prometheus.Graph.prototype.clearWarning = function() {
var self = this;
self.warning.html('');
self.warning.hide();
};
Prometheus.Graph.prototype.updateRefresh = function() {
var self = this;
@ -803,6 +817,7 @@ Prometheus.Graph.prototype.handleConsoleResponse = function(data, textStatus) {
tBody.append("<tr><td colspan='2'><i>no data</i></td></tr>");
return;
}
data.result = self.limitSeries(data.result);
for (var i = 0; i < data.result.length; i++) {
var s = data.result[i];
var tsName = self.metricToTsName(s.metric);
@ -814,6 +829,7 @@ Prometheus.Graph.prototype.handleConsoleResponse = function(data, textStatus) {
tBody.append("<tr><td colspan='2'><i>no data</i></td></tr>");
return;
}
data.result = self.limitSeries(data.result);
for (var i = 0; i < data.result.length; i++) {
var v = data.result[i];
var tsName = self.metricToTsName(v.metric);
@ -887,6 +903,20 @@ Prometheus.Graph.prototype.formatKMBT = function(y) {
}
}
Prometheus.Graph.prototype.limitSeries = function(result) {
var self = this;
var MAX_SERIES_NUM = 10000;
var message = "<strong>Warning!</strong> Fetched " +
result.length + " series, but displaying only first " +
MAX_SERIES_NUM + ".";
if (result.length > MAX_SERIES_NUM) {
self.showWarning(message);
return result.splice(0, MAX_SERIES_NUM);
}
return result;
}
/**
* Page
*/