Merge pull request #3186 from stormpython/fix/3169

Align legend and pie colors

src/kibana/components/vislib/lib/data.js

@@ -6,6 +6,7 @@ define(function (require) {
     var orderKeys = Private(require('components/vislib/components/zero_injection/ordered_x_keys'));
     var getLabels = Private(require('components/vislib/components/labels/labels'));
     var color = Private(require('components/vislib/components/color/color'));
+    var errors = require('errors');
 
     /**
      * Provides an API for pulling values off the data
@@ -510,6 +511,33 @@ define(function (require) {
       }
     };
 
+    /**
+     * Checks whether all pie slices have zero values.
+     * If so, an error is thrown.
+     */
+    Data.prototype._validatePieData = function () {
+      var visData = this.getVisData();
+
+      visData.forEach(function (chartData) {
+        chartData.slices = (function withoutZeroSlices(slices) {
+          if (!slices.children) return slices;
+
+          slices = _.clone(slices);
+          slices.children = slices.children.reduce(function (children, child) {
+            if (child.size !== 0) {
+              children.push(withoutZeroSlices(child));
+            }
+            return children;
+          }, []);
+          return slices;
+        }(chartData.slices));
+
+        if (chartData.slices.children.length === 0) {
+          throw new errors.PieContainsAllZeros();
+        }
+      });
+    };
+
     /**
      * Returns an array of names ordered by appearance in the nested array
      * of objects
@@ -521,6 +549,8 @@ define(function (require) {
       var self = this;
       var names = [];
 
+      this._validatePieData();
+
       _.forEach(this.getVisData(), function (obj) {
         var columns = obj.raw ? obj.raw.columns : undefined;
 

src/kibana/components/vislib/visualizations/pie_chart.js

@@ -24,9 +24,6 @@ define(function (require) {
       }
       PieChart.Super.apply(this, arguments);
 
-      // Check whether pie chart should be rendered.
-      this._validatePieData();
-
       this._attr = _.defaults(handler._attr || {}, {
         isDonut: handler._attr.isDonut || false
       });
@@ -150,29 +147,6 @@ define(function (require) {
       return path;
     };
 
-    /**
-     * Checks whether all pie slices have zero values.
-     * If so, an error is thrown.
-     */
-    PieChart.prototype._validatePieData = function () {
-      this.chartData.slices = (function withoutZeroSlices(slices) {
-        if (!slices.children) return slices;
-
-        slices = _.clone(slices);
-        slices.children = slices.children.reduce(function (children, child) {
-          if (child.size !== 0) {
-            children.push(withoutZeroSlices(child));
-          }
-          return children;
-        }, []);
-        return slices;
-      }(this.chartData.slices));
-
-      if (this.chartData.slices.children.length === 0) {
-        throw new errors.PieContainsAllZeros();
-      }
-    };
-
     /**
      * Renders d3 visualization
      *

test/unit/specs/vislib/lib/legend.js

@@ -48,6 +48,33 @@ define(function (require) {
         vis = null;
       });
 
+      describe('legend item color matches slice color', function () {
+        var items;
+        var paths;
+        var getColor;
+
+        if (chartTypes[i] === 'pie') {
+          it('should match the slice color', function () {
+            paths = $(vis.el).find('path').toArray();
+            items = vis.handler.legend.labels;
+            getColor = vis.handler.legend.color;
+
+            items.forEach(function (label) {
+              var slices = paths.filter(function (path) {
+                if (path.__data__.name === undefined) return false;
+                return path.__data__.name.toString() === label;
+              }).map(function (path) {
+                return $(path).attr('class').split(/\s+/)[2].replace('c', '#');
+              });
+
+              slices.forEach(function (hex) {
+                expect(hex).to.be(getColor(label));
+              });
+            });
+          });
+        }
+      });
+
       describe('header method', function () {
         it('should append the legend header', function () {
           expect($(vis.el).find('.header').length).to.be(1);