Merge pull request #1963 from stormpython/fix/#1769

Area chart no longer empty by default.
elastic · Dec 1, 2014 · 7524dc6 · 7524dc6
2 parents 3b28ac3 + 9fbcb08
commit 7524dc6
Show file tree

Hide file tree

Showing 9 changed files with 176 additions and 19 deletions.
diff --git a/src/kibana/components/errors.js b/src/kibana/components/errors.js
@@ -191,5 +191,17 @@ define(function (require) {
   };
   inherits(errors.ContainerTooSmall, KbnError);
 
+  /**
+   * error thrown when user tries to render an area chart with less
+   * than 2 data points
+   * @param {String} message - the message to provide with the error
+   */
+  errors.NotEnoughData = function NotEnoughData() {
+    KbnError.call(this,
+      'There are not enough data points to render this chart',
+      errors.NotEnoughData);
+  };
+  inherits(errors.NotEnoughData, KbnError);
+
   return errors;
-});
+});
diff --git a/src/kibana/components/vislib/lib/handler/handler.js b/src/kibana/components/vislib/lib/handler/handler.js
@@ -157,8 +157,8 @@ define(function (require) {
       .append('div')
       // class name needs `chart` in it for the polling checkSize function
       // to continuously call render on resize
-      .attr('class', 'chart error')
-      .append('p')
+      .attr('class', 'visualize-error chart error')
+      .append('h4')
       .text(message);
     };
 

diff --git a/src/kibana/components/vislib/vis.js b/src/kibana/components/vislib/vis.js
@@ -80,10 +80,11 @@ define(function (require) {
         // If involving height and width of the container, log error to screen.
         // Because we have to wait for the DOM element to initialize, we do not
         // want to throw an error when the DOM `el` is zero
-        if (error instanceof errors.ContainerTooSmall) {
+        if (error instanceof errors.ContainerTooSmall ||
+          error instanceof errors.NotEnoughData) {
           this.handler.error(error.message);
         } else {
-          console.error(error.stack);
+          throw error;
         }
       }
     };

diff --git a/src/kibana/components/vislib/visualizations/area_chart.js b/src/kibana/components/vislib/visualizations/area_chart.js
@@ -34,6 +34,8 @@ define(function (require) {
         handler._attr.defaultOpacity = 0.6;
       }
 
+      this.checkIfEnoughData();
+
       this._attr = _.defaults(handler._attr || {}, {
         xValue: function (d) { return d.x; },
         yValue: function (d) { return d.y; }
@@ -260,6 +262,18 @@ define(function (require) {
       .attr('height', height + clipPathBuffer);
     };
 
+    AreaChart.prototype.checkIfEnoughData = function () {
+      var series = this.chartData.series;
+
+      var notEnoughData = series.some(function (obj) {
+        return obj.values.length < 2;
+      });
+
+      if (notEnoughData) {
+        throw new errors.NotEnoughData();
+      }
+    };
+
     /**
      * Renders d3 visualization
      *

diff --git a/test/unit/specs/vislib/components/tooltip/_render.js b/test/unit/specs/vislib/components/tooltip/_render.js
@@ -17,7 +17,7 @@ define(function (require) {
 
       beforeEach(function () {
         inject(function (d3, Private) {
-          vis = Private(require('vislib_fixtures/_vis_fixture'))('histogram');
+          vis = Private(require('vislib_fixtures/_vis_fixture'))();
           data = require('vislib_fixtures/mock_data/series/_data0');
           require('css!components/vislib/styles/main');
 
@@ -53,4 +53,4 @@ define(function (require) {
       });
     });
   };
-});
+});
diff --git a/test/unit/specs/vislib/fixture/_vis_fixture.js b/test/unit/specs/vislib/fixture/_vis_fixture.js
@@ -2,20 +2,20 @@ define(function (require) {
   return function VisLibFixtures(Private) {
     var $ = require('jquery');
 
-    return function (type) {
+    return function (visLibParams) {
       var Vis = Private(require('components/vislib/vis'));
-      var visChart = $('body').append('<div class=visualize-chart></div>');
+
+      $('body').append('<div class=visualize-chart></div>');
+
       var $el = $('.visualize-chart');
-      var config = {
-        shareYAxis: true,
-        addTooltip: true,
-        addLegend: true,
-        addEvents: true,
-        addBrushing: true,
-        type: type
-      };
+      var config = visLibParams || {
+          shareYAxis: true,
+          addTooltip: true,
+          addLegend: true,
+          type: 'histogram'
+        };
 
       return new Vis($el, config);
     };
   };
-});
+});
diff --git a/test/unit/specs/vislib/fixture/mock_data/not_enough_data/_one_point.js b/test/unit/specs/vislib/fixture/mock_data/not_enough_data/_one_point.js
@@ -0,0 +1,70 @@
+define(function (require) {
+  var _ = require('lodash');
+
+  return {
+    'label': '',
+    'xAxisLabel': '',
+    'yAxisLabel': 'Count of documents',
+    'series': [
+      {
+        'values': [
+          {
+            'x': '_all',
+            'y': 274
+          }
+        ]
+      }
+    ],
+    'raw': {
+      'splitColumns': [],
+      'splitValStack': [],
+      'columns': [
+        {
+          'categoryName': 'metric',
+          'id': 1,
+          'aggConfig': {
+            'id': 1,
+            'type': 'count',
+            'schema': 'metric',
+            'params': {}
+          },
+          'aggType': {
+            'name': 'count',
+            'title': 'Count',
+            'hasNoDsl': true,
+            'params': [
+              {
+                'name': 'json',
+                'type': 'json',
+                'advanced': true
+              }
+            ],
+            'type': 'metrics'
+          },
+          'label': 'Count of documents',
+          'params': {}
+        }
+      ],
+      'rows': [
+        [
+          274
+        ]
+      ]
+    },
+    'hits': 274,
+    'xAxisFormatter': function (val) {
+      if (_.isObject(val)) {
+        return JSON.stringify(val);
+      }
+      else if (val == null) {
+        return '';
+      }
+      else {
+        return '' + val;
+      }
+    },
+    'tooltipFormatter': function (d) {
+      return d;
+    }
+  };
+});
diff --git a/test/unit/specs/vislib/lib/handler.js b/test/unit/specs/vislib/lib/handler.js
@@ -207,7 +207,7 @@ define(function (require) {
 
       it('should return an error classed DOM element with a text message', function () {
         expect($('.visualize').find('.error').length).to.be(1);
-        expect($('.error p').html()).to.be('This is an error!');
+        expect($('.error h4').html()).to.be('This is an error!');
       });
     });
 

diff --git a/test/unit/specs/vislib/visualizations/area_chart.js b/test/unit/specs/vislib/visualizations/area_chart.js
@@ -0,0 +1,60 @@
+define(function (require) {
+  var angular = require('angular');
+  var $ = require('jquery');
+
+  angular.module('AreaChartFactory', ['kibana']);
+
+  describe('VisLib Area Chart Test Suite', function () {
+    describe('checkIfEnoughData method', function () {
+      var visLibParams = {
+        type: 'area',
+        addLegend: true,
+        addTooltip: true
+      };
+      var errorVis;
+      var goodVis;
+      var notEnoughData;
+      var enoughData;
+
+      beforeEach(function () {
+        module('AreaChartFactory');
+      });
+
+      beforeEach(function () {
+        inject(function (Private) {
+          errorVis = Private(require('vislib_fixtures/_vis_fixture'))(visLibParams);
+          goodVis = Private(require('vislib_fixtures/_vis_fixture'))(visLibParams);
+          notEnoughData = require('vislib_fixtures/mock_data/not_enough_data/_one_point');
+          enoughData = require('vislib_fixtures/mock_data/series/_data0');
+          require('css!components/vislib/styles/main');
+
+          errorVis.render(notEnoughData);
+          goodVis.render(enoughData);
+        });
+      });
+
+      afterEach(function () {
+        $(errorVis.el).remove();
+        $(goodVis.el).remove();
+        errorVis = null;
+        goodVis = null;
+      });
+
+      it('should throw a Not Enough Data Error', function () {
+        errorVis.handler.charts.forEach(function (chart) {
+          expect(function () {
+            chart.checkIfEnoughData();
+          }).to.throwError();
+        });
+      });
+
+      it('should not throw a Not Enough Data Error', function () {
+        goodVis.handler.charts.forEach(function (chart) {
+          expect(function () {
+            chart.checkIfEnoughData();
+          }).to.not.throwError();
+        });
+      });
+    });
+  });
+});