diff --git a/src/app/panels/graphite/editor.html b/src/app/panels/graphite/editor.html
index f091d46c383..266a165b98c 100644
--- a/src/app/panels/graphite/editor.html
+++ b/src/app/panels/graphite/editor.html
@@ -7,11 +7,11 @@
-
+
\ No newline at end of file
diff --git a/src/app/panels/graphite/module.html b/src/app/panels/graphite/module.html
index efa17d68b24..72838b91356 100644
--- a/src/app/panels/graphite/module.html
+++ b/src/app/panels/graphite/module.html
@@ -106,11 +106,11 @@
-
-
+
+
- {{series.info.alias || series.info.query}}
- {{series.info.alias}}
+ {{series.alias || series.query}}
+ {{series.alias}}
diff --git a/src/app/panels/graphite/module.js b/src/app/panels/graphite/module.js
index 06cbcc214ba..8eeaacae19d 100644
--- a/src/app/panels/graphite/module.js
+++ b/src/app/panels/graphite/module.js
@@ -204,9 +204,6 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) {
$scope.init = function() {
// Hide view options by default
$scope.options = false;
- $scope.$on('refresh',function(){
- $scope.get_data();
- });
// Always show the query if an alias isn't set. Users can set an alias if the query is too
// long
@@ -294,8 +291,6 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) {
var range = $scope.get_time_range();
var interval = $scope.get_interval(range);
- console.log('Interval: ' + interval);
-
var graphiteLoadOptions = {
range: range,
targets: $scope.panel.targets,
@@ -307,7 +302,7 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) {
$scope.receiveGraphiteData(range, interval)
]);
- result(function (success, failure) {
+ result(function (data, failure) {
if (failure) {
$scope.panel.error = 'Failed to do fetch graphite data: ' + failure;
return;
@@ -317,7 +312,7 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) {
$scope.$apply();
// Tell the histogram directive to render.
- $scope.$emit('render');
+ $scope.$emit('render', data);
});
};
@@ -325,14 +320,15 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) {
$scope.receiveGraphiteData = function(range, interval) {
return function receive_graphite_data_requestor(requestion, results) {
+ $scope.legend = [];
+ var data = [];
- $scope.data = [];
if(results.length == 0 ) {
requestion('no data in response from graphite');
}
- console.log('Data from graphite:', results);
- console.log('nr datapoints from graphite: %d', results[0].datapoints.length);
+ //console.log('Data from graphite:', results);
+ //console.log('nr datapoints from graphite: %d', results[0].datapoints.length);
var tsOpts = {
interval: interval,
@@ -350,18 +346,22 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) {
}
});
- $scope.data.push({
- info: {
- alias: targetData.target,
- color: $scope.colors[$scope.data.length],
- enable: true
- },
- time_series: time_series,
- hits: 0
+ var seriesInfo = {
+ alias: targetData.target,
+ color: $scope.colors[data.length],
+ enable: true
+ };
+
+ $scope.legend.push(seriesInfo);
+
+ data.push({
+ info: seriesInfo,
+ time_series: time_series
});
+
});
- requestion('ok');
+ requestion(data);
};
};
@@ -443,15 +443,21 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) {
restrict: 'A',
template: '',
link: function(scope, elem) {
+ var data = [];
+
+ scope.$on('refresh',function() {
+ scope.get_data();
+ });
// Receive render events
- scope.$on('render',function(){
- render_panel();
+ scope.$on('render',function(event, d) {
+ data = d || data;
+ render_panel(data);
});
// Re-render if the window is resized
- angular.element(window).bind('resize', function(){
- render_panel();
+ angular.element(window).bind('resize', function() {
+ render_panel(data);
});
var scale = function(series,factor) {
@@ -479,13 +485,13 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) {
};
// Function for rendering panel
- function render_panel() {
+ function render_panel(data) {
// IE doesn't work without this
elem.css({height:scope.panel.height || scope.row.height});
// Populate from the query service
try {
- _.each(scope.data, function(series) {
+ _.each(data, function(series) {
series.label = series.info.alias;
series.color = series.info.color;
});
@@ -584,8 +590,8 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) {
// when rendering stacked bars, we need to ensure each point that has data is zero-filled
// so that the stacking happens in the proper order
var required_times = [];
- if (scope.data.length > 1) {
- required_times = Array.prototype.concat.apply([], _.map(scope.data, function (query) {
+ if (data.length > 1) {
+ required_times = Array.prototype.concat.apply([], _.map(data, function (query) {
return query.time_series.getOrderedTimes();
}));
required_times = _.uniq(required_times.sort(function (a, b) {
@@ -594,17 +600,16 @@ function (angular, app, $, _, kbn, moment, timeSeries, graphiteSrv) {
}), true);
}
- for (var i = 0; i < scope.data.length; i++) {
- var _d = scope.data[i].time_series.getFlotPairs(required_times);
- scope.data[i].data = _d;
+ for (var i = 0; i < data.length; i++) {
+ var _d = data[i].time_series.getFlotPairs(required_times);
+ data[i].data = _d;
}
- var totalDataPoints = _.reduce(scope.data, function(num, series) { return series.data.length + num; }, 0);
- console.log('Datapoints[0] count:', scope.data[0].data.length);
- console.log('Datapoints.Total count:', totalDataPoints);
+ /* var totalDataPoints = _.reduce(data, function(num, series) { return series.data.length + num; }, 0);
+ console.log('Datapoints[0] count:', data[0].data.length);
+ console.log('Datapoints.Total count:', totalDataPoints);*/
-
- scope.plot = $.plot(elem, scope.data, options);
+ scope.plot = $.plot(elem, data, options);
} catch(e) {
console.log(e);