You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ambari.apache.org by nc...@apache.org on 2016/02/11 14:47:02 UTC

[02/17] ambari git commit: AMBARI-14985. Templated Dashboard for Ambari-Metrics-Grafana. (Prajwal Rao via yusaku)

AMBARI-14985. Templated Dashboard for Ambari-Metrics-Grafana. (Prajwal Rao via yusaku)


Project: http://git-wip-us.apache.org/repos/asf/ambari/repo
Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/8f3b9c49
Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/8f3b9c49
Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/8f3b9c49

Branch: refs/heads/branch-dev-patch-upgrade
Commit: 8f3b9c49d3fecf7db43b16ef8c06571fd2f79ed9
Parents: ac5ca8f
Author: Yusaku Sako <yu...@hortonworks.com>
Authored: Wed Feb 10 10:05:27 2016 -0800
Committer: Yusaku Sako <yu...@hortonworks.com>
Committed: Wed Feb 10 10:05:27 2016 -0800

----------------------------------------------------------------------
 ambari-metrics/ambari-metrics-grafana/README.md |  20 +++
 .../ambari-metrics/datasource.js                | 127 +++++++++----------
 .../ambari-metrics/partials/query.editor.html   |   6 +-
 .../screenshots/20-templating.png               | Bin 0 -> 694376 bytes
 4 files changed, 82 insertions(+), 71 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/ambari/blob/8f3b9c49/ambari-metrics/ambari-metrics-grafana/README.md
----------------------------------------------------------------------
diff --git a/ambari-metrics/ambari-metrics-grafana/README.md b/ambari-metrics/ambari-metrics-grafana/README.md
index 0a138e8..7eb84a7 100644
--- a/ambari-metrics/ambari-metrics-grafana/README.md
+++ b/ambari-metrics/ambari-metrics-grafana/README.md
@@ -240,4 +240,24 @@ http://GRAFANA_HOST:3000
 
 ---
 
+<a name="templating"></a>
+### Templating
 
+**Templating allows you to dynamically change graphs by selecting your host from dropdown. To created a templated dashboard, you can follow these steps.**
+
+> 1. Click on the "cog" on the top, select "Templating"
+> 2. Click on "+ New"
+> 3. Enter a name for your variable. Ex: "hosts".
+> 4. Type: query
+> 5. Datasource: This should be set to the name you had chosen for your Datasource. Default is "AMBARI_METRICS"
+> 6. Query: This needs to be "hosts". It is case sensitive as well.
+> 7. Once you've entered the query and you focus your cursor anywhere else, you should see the "Preview of values" updated with the hostnames in your cluster.
+> 8. You can close the Templating Variables section.
+> 9. You should now have a dropdown on your dashboard with hosts from your cluster.
+> 10. When you now add a graph, and select your component and metric, the plotted graph will show you metrics for the selected hostname from the dropdown.
+> 11. The legend on the graph will also now update with the selected host.
+
+**Templalted dashboards do support multiple metrics in a single graph.** 
+
+
+![Templating](screenshots/20-templating.png)

http://git-wip-us.apache.org/repos/asf/ambari/blob/8f3b9c49/ambari-metrics/ambari-metrics-grafana/ambari-metrics/datasource.js
----------------------------------------------------------------------
diff --git a/ambari-metrics/ambari-metrics-grafana/ambari-metrics/datasource.js b/ambari-metrics/ambari-metrics-grafana/ambari-metrics/datasource.js
index 374501c..e89ad0e 100644
--- a/ambari-metrics/ambari-metrics-grafana/ambari-metrics/datasource.js
+++ b/ambari-metrics/ambari-metrics-grafana/ambari-metrics/datasource.js
@@ -27,7 +27,7 @@ define([
 
       var module = angular.module('grafana.services');
 
-      module.factory('AmbariMetricsDatasource', function ($q, backendSrv) {
+      module.factory('AmbariMetricsDatasource', function ($q, backendSrv, templateSrv) {
         /**
          * AMS Datasource Constructor
          */
@@ -43,7 +43,9 @@ define([
             .then(function (items) {
               allMetrics = [];
               appIds = [];
-              var fake = "timeline_metric_store_watcher"; delete items[fake];
+              //We remove a couple of components from the list that do not contain any
+              //pertinent metrics.
+              delete items.timeline_metric_store_watcher; delete items.amssmoketestfake;
               for (var key in items) {
                 if (items.hasOwnProperty(key)) {
                   items[key].forEach(function (_item) {
@@ -97,10 +99,11 @@ define([
               }
               var series = [];
               var metricData = res.metrics[0].metrics;
+              var hostLegend = res.metrics[0].hostname ? ' on ' + res.metrics[0].hostname : '';
               var timeSeries = {};
               if (target.hosts === undefined || target.hosts.trim() === "") {
                 timeSeries = {
-                  target: target.metric,
+                  target: target.metric + hostLegend,
                   datapoints: []
                 };
               } else {
@@ -119,81 +122,42 @@ define([
             };
 
           };
-          var precisionSetting = '';
+
           var getHostAppIdData = function(target) {
-            if (target.shouldAddPrecision) {
-              precisionSetting = '&precision=' + target.precision;
-            } else {
-              precisionSetting = '';
-            }
-            if (target.shouldAddPrecision && target.shouldComputeRate) {
-              return backendSrv.get(self.url + '/ws/v1/timeline/metrics?metricNames=' + target.metric + "._rate._"
-                + target.aggregator + "&hostname=" + target.hosts + '&appId=' + target.app + '&startTime=' + from
-                + '&endTime=' + to + precisionSetting).then(
-                  getMetricsData(target)
-                );
-            } else if (target.shouldComputeRate) {
-              return backendSrv.get(self.url + '/ws/v1/timeline/metrics?metricNames=' + target.metric + "._rate._"
-                + target.aggregator + "&hostname=" + target.hosts + '&appId=' + target.app + '&startTime=' + from
-                + '&endTime=' + to).then(
-                  getMetricsData(target)
-                );
-            } else if (target.shouldAddPrecision){
-              return backendSrv.get(self.url + '/ws/v1/timeline/metrics?metricNames=' + target.metric + "._"
-                + target.aggregator + "&hostname=" + target.hosts + '&appId=' + target.app + '&startTime=' + from
-                + '&endTime=' + to + precisionSetting).then(
-                  getMetricsData(target)
-                );
-            } else {
-              return backendSrv.get(self.url + '/ws/v1/timeline/metrics?metricNames=' + target.metric + "._"
-                + target.aggregator + "&hostname=" + target.hosts + '&appId=' + target.app + '&startTime=' + from
-                + '&endTime=' + to).then(
+            var precision = target.shouldAddPrecision ? '&precision=' + target.precision : '';
+            var rate = target.shouldComputeRate ? '._rate._' : '._';
+            return backendSrv.get(self.url + '/ws/v1/timeline/metrics?metricNames=' + target.metric + rate +
+                target.aggregator + "&hostname=" + target.hosts + '&appId=' + target.app + '&startTime=' + from +
+                '&endTime=' + to + precision).then(
                 getMetricsData(target)
-              );
-            }
+            );
           };
 
           var getServiceAppIdData = function(target) {
-            if (target.shouldAddPrecision) { precisionSetting = '&precision=' + target.precision;
-            } else { precisionSetting = ''; }
-            if (target.shouldAddPrecision && target.shouldComputeRate) {
-              return backendSrv.get(self.url + '/ws/v1/timeline/metrics?metricNames=' + target.metric + "._rate._"
-                + target.aggregator + '&appId=' + target.app + '&startTime=' + from + '&endTime=' + to + precisionSetting)
-              .then(
-                getMetricsData(target)
-              );
-            } else if (target.shouldAddPrecision) {
-              return backendSrv.get(self.url + '/ws/v1/timeline/metrics?metricNames=' + target.metric + "._"
-                + target.aggregator + '&appId=' + target.app + '&startTime=' + from + '&endTime=' + to + precisionSetting)
-              .then(
-                getMetricsData(target)
-              );
-            } else if (target.shouldComputeRate) {
-              return backendSrv.get(self.url + '/ws/v1/timeline/metrics?metricNames=' + target.metric + "._rate._"
-                + target.aggregator + '&appId=' + target.app + '&startTime=' + from + '&endTime=' + to).then(
-                getMetricsData(target)
-              );
-            } else {
-              return backendSrv.get(self.url + '/ws/v1/timeline/metrics?metricNames=' + target.metric + "._"
-                + target.aggregator + '&appId=' + target.app + '&startTime=' + from + '&endTime=' + to).then(
-                getMetricsData(target)
-              );
-            }
+            var templatedHost = (_.isEmpty(templateSrv.variables)) ? "" : templateSrv.variables[0].options.filter(function(host)
+              { return host.selected; }).map(function(hostName) { return hostName.value; });
+            var precision = target.shouldAddPrecision ? '&precision=' + target.precision : '';
+            var rate = target.shouldComputeRate ? '._rate._' : '._';
+            return backendSrv.get(self.url + '/ws/v1/timeline/metrics?metricNames=' + target.metric + rate
+              + target.aggregator + '&hostname=' + templatedHost + '&appId=' + target.app + '&startTime=' + from +
+              '&endTime=' + to + precision).then(
+              getMetricsData(target)
+            );
           };
 
           // Time Ranges
           var from = Math.floor(options.range.from.valueOf() / 1000);
           var to = Math.floor(options.range.to.valueOf() / 1000);
-
           var metricsPromises = _.map(options.targets, function(target) {
-            console.debug('target app=' + target.app + ',' +
-              'target metric=' + target.metric + ' on host=' + target.hosts);
-            if (!!target.hosts) {
-              return getHostAppIdData(target);
-            } else {
-              return getServiceAppIdData(target);
-            }
-          });
+              console.debug('target app=' + target.app + ',' +
+                'target metric=' + target.metric + ' on host=' + target.hosts);
+              if (!!target.hosts) {
+                return getHostAppIdData(target);
+              } else {
+                return getServiceAppIdData(target);
+              }
+            });
+
           return $q.all(metricsPromises).then(function(metricsDataArray) {
             var data = _.map(metricsDataArray, function(metricsData) {
               return metricsData.data;
@@ -215,6 +179,32 @@ define([
         };
 
         /**
+         * AMS Datasource Templating Variables.
+         */
+        AmbariMetricsDatasource.prototype.metricFindQuery = function (query) {
+          var interpolated;
+          try {
+            interpolated = templateSrv.replace(query);
+          } catch (err) {
+            return $q.reject(err);
+          }
+          return this.doAmbariRequest({
+                method: 'GET',
+                url: '/ws/v1/timeline/metrics/' + interpolated
+              })
+              .then(function (results) {
+                //Remove fakehostname from the list of hosts on the cluster.
+                var fake = "fakehostname"; delete results.data[fake];
+                return _.map(_.keys(results.data), function (hostName) {
+                  return {
+                        text: hostName,
+                        expandable: hostName.expandable ? true : false
+                      };
+                });
+              });
+        };
+
+        /**
          * AMS Datasource  - Test Data Source Connection.
          *
          * Added Check to see if Datasource is working. Throws up an error in the
@@ -277,6 +267,7 @@ define([
           console.log(query);
           return this.doAmbariRequest({method: 'GET', url: '/ws/v1/timeline/metrics/hosts'})
             .then(function (results) {
+              //Remove fakehostname from the list of hosts on the cluster.
               var fake = "fakehostname"; delete results.data[fake];
               return _.map(Object.keys(results.data), function (hostName) {
                 return {text: hostName};
@@ -301,4 +292,4 @@ define([
         return AmbariMetricsDatasource;
       });
     }
-);
+);
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/ambari/blob/8f3b9c49/ambari-metrics/ambari-metrics-grafana/ambari-metrics/partials/query.editor.html
----------------------------------------------------------------------
diff --git a/ambari-metrics/ambari-metrics-grafana/ambari-metrics/partials/query.editor.html b/ambari-metrics/ambari-metrics-grafana/ambari-metrics/partials/query.editor.html
index d4dffb4..f51866e 100644
--- a/ambari-metrics/ambari-metrics-grafana/ambari-metrics/partials/query.editor.html
+++ b/ambari-metrics/ambari-metrics-grafana/ambari-metrics/partials/query.editor.html
@@ -82,10 +82,10 @@
         </li>
 
 
-        <li class="tight-form-item" style="width: 86px">
-            Hosts <a bs-tooltip="'if host is selected, aggregator is ignored.'" data-placement="bottom"><i class="fa fa-info-circle"></i></a>
+        <li class="tight-form-item" style="width: 86px" ng-hide="dashboard.templating.list.length > 0">
+            Hosts
         </li>
-        <li>
+        <li ng-hide="dashboard.templating.list.length > 0">
             <input type="text" class="input-large tight-form-input" ng-model="target.hosts"
                    spellcheck='false' bs-typeahead="suggestHosts" placeholder="host name" data-min-length=0 data-items=100
                    ng-blur="targetBlur()">

http://git-wip-us.apache.org/repos/asf/ambari/blob/8f3b9c49/ambari-metrics/ambari-metrics-grafana/screenshots/20-templating.png
----------------------------------------------------------------------
diff --git a/ambari-metrics/ambari-metrics-grafana/screenshots/20-templating.png b/ambari-metrics/ambari-metrics-grafana/screenshots/20-templating.png
new file mode 100644
index 0000000..71b8b9f
Binary files /dev/null and b/ambari-metrics/ambari-metrics-grafana/screenshots/20-templating.png differ