sorting chart xValues by metric sum (#9017)

Backports PR #8397

**Commit 1:**
sorting chart xValues by metric sum

* Original sha: 64db47ef08
* Authored by ppisljar <peter.pisljar@gmail.com> on 2016-09-21T09:14:49Z

**Commit 2:**
fixing tests

* Original sha: b6bcd55c11
* Authored by ppisljar <peter.pisljar@gmail.com> on 2016-09-21T09:40:54Z

**Commit 3:**
adding order buckets by value option to point series charts

* Original sha: c03bc99be5
* Authored by ppisljar <peter.pisljar@gmail.com> on 2016-09-22T07:50:02Z

**Commit 4:**
fixing tests

* Original sha: 591729394f
* Authored by ppisljar <peter.pisljar@gmail.com> on 2016-09-22T15:11:40Z

**Commit 5:**
fixing tests

* Original sha: 19bcdfe614
* Authored by ppisljar <peter.pisljar@gmail.com> on 2016-09-22T15:21:07Z

**Commit 6:**
Updating based on CJs comments and adding documentation

* Original sha: cccc06fa68
* Authored by ppisljar <peter.pisljar@gmail.com> on 2016-09-23T06:06:06Z

docs/visualize/area.asciidoc

@@ -66,6 +66,7 @@ Checkboxes are available to enable and disable the following behaviors:
 values.
 *Scale Y-Axis to Data Bounds*:: The default Y axis bounds are zero and the maximum value returned in the data. Check
 this box to change both upper and lower bounds to match the values returned in the data.
+*Order buckets by descending sum*:: Check this box to enforce sorting of buckets by descending sum in the visualization
 *Show Tooltip*:: Check this box to enable the display of tooltips.
 
 [float]

docs/visualize/line.asciidoc

@@ -48,6 +48,7 @@ values.
 *Show Tooltip*:: Check this box to enable the display of tooltips.
 *Scale Y-Axis to Data Bounds*:: The default Y-axis bounds are zero and the maximum value returned in the data. Check
 this box to change both upper and lower bounds to match the values returned in the data.
+*Order buckets by descending sum*:: Check this box to enforce sorting of buckets by descending sum in the visualization
 
 After changing options, click the  *Apply changes* button to update your visualization, or the grey *Discard
 changes* button to keep your visualization in its current state.

docs/visualize/vertbar.asciidoc

@@ -69,6 +69,7 @@ Checkboxes are available to enable and disable the following behaviors:
 *Show Tooltip*:: Check this box to enable the display of tooltips.
 *Scale Y-Axis to Data Bounds*:: The default Y axis bounds are zero and the maximum value returned in the data. Check
 this box to change both upper and lower bounds to match the values returned in the data.
+*Order buckets by descending sum*:: Check this box to enforce sorting of buckets by descending sum in the visualization
 
 [float]
 [[vertbar-viewing-detailed-information]]

src/core_plugins/kbn_vislib_vis_types/public/controls/point_series_options.html

@@ -45,5 +45,11 @@
         Scale Y-Axis to Data Bounds
       </label>
     </div>
+    <div class="vis-option-item">
+      <label>
+        <input type="checkbox" ng-model="vis.params.orderBucketsBySum">
+        Order buckets by descending sum
+      </label>
+    </div>
   </div>
 </div>

src/ui/public/vislib/__tests__/components/zero_injection.js

@@ -407,7 +407,7 @@ describe('Vislib Zero Injection Module Test Suite', function () {
       expect(_.isArray(results)).to.be(true);
     });
 
-    it('should return an array of values in the correct order', function () {
+    it('should return an array of values ordered by their index by default', function () {
       expect(results[0]).to.be('1');
       expect(results[1]).to.be('2');
       expect(results[2]).to.be('3');
@@ -419,6 +419,23 @@ describe('Vislib Zero Injection Module Test Suite', function () {
       expect(numberedResults[3]).to.be(4);
       expect(numberedResults[4]).to.be(5);
     });
+
+    it('should return an array of values ordered by their sum when orderBucketsBySum is true', function () {
+      const orderBucketsBySum = true;
+      results = orderXValues(multiSeriesData, orderBucketsBySum);
+      numberedResults = orderXValues(multiSeriesNumberedData, orderBucketsBySum);
+
+      expect(results[0]).to.be('3');
+      expect(results[1]).to.be('1');
+      expect(results[2]).to.be('4');
+      expect(results[3]).to.be('5');
+      expect(results[4]).to.be('2');
+      expect(numberedResults[0]).to.be(3);
+      expect(numberedResults[1]).to.be(1);
+      expect(numberedResults[2]).to.be(4);
+      expect(numberedResults[3]).to.be(5);
+      expect(numberedResults[4]).to.be(2);
+    });
   });
 
   describe('Unique Keys', function () {

src/ui/public/vislib/components/zero_injection/inject_zeros.js

@@ -29,12 +29,12 @@ export default function ZeroInjectionUtilService(Private) {
     }
   }
 
-  return function (obj) {
+  return function (obj, orderBucketsBySum = false) {
     if (!_.isObject(obj) || !obj.rows && !obj.columns && !obj.series) {
       throw new TypeError('ZeroInjectionUtilService expects an object with a series, rows, or columns key');
     }
 
-    const keys = orderXValues(obj);
+    const keys = orderXValues(obj, orderBucketsBySum);
     const arr = getDataArray(obj);
 
     arr.forEach(function (object) {

src/ui/public/vislib/components/zero_injection/ordered_x_keys.js

@@ -11,7 +11,7 @@ export default function OrderedXKeysUtilService(Private) {
    * else values sorted by index
    */
 
-  return function (obj) {
+  return function (obj, orderBucketsBySum = false) {
     if (!_.isObject(obj)) {
       throw new Error('OrderedXKeysUtilService expects an object');
     }
@@ -27,7 +27,7 @@ export default function OrderedXKeysUtilService(Private) {
       if (d[1].isDate || d[1].isOrdered) {
         return +d[0];
       }
-      return d[1].index;
+      return orderBucketsBySum ? -d[1].sum : d[1].index;
     })
     .map(function (d, i, list) {
       if (!d[1].isNumber) return d[0];

src/ui/public/vislib/components/zero_injection/uniq_keys.js

@@ -37,20 +37,22 @@ export default function UniqueXValuesUtilService(Private) {
     flattenedData.forEach(function (d, i) {
       const key = d.x;
       const prev = uniqueXValues.get(key);
-
+      let sum = d.y;
       if (d.xi != null) {
         i = d.xi;
       }
 
       if (prev) {
         i = Math.min(i, prev.index);
+        sum += prev.sum;
       }
 
       uniqueXValues.set(key, {
         index: i,
         isDate: isDate,
         isOrdered: isOrdered,
-        isNumber: _.isNumber(key)
+        isNumber: _.isNumber(key),
+        sum: sum
       });
     });
 

src/ui/public/vislib/lib/data.js

@@ -601,7 +601,7 @@ export default function DataFactory(Private) {
      * @returns {Array} Array of x axis values
      */
     xValues() {
-      return orderKeys(this.data);
+      return orderKeys(this.data, this._attr.orderBucketsBySum);
     };
 
     /**

src/ui/public/vislib/lib/handler/types/point_series.js

@@ -19,7 +19,7 @@ export default function ColumnHandler(Private) {
 
   function getData(vis, opts) {
     if (opts.zeroFill) {
-      return new Data(injectZeros(vis.data), vis._attr, vis.uiState);
+      return new Data(injectZeros(vis.data, vis._attr.orderBucketsBySum), vis._attr, vis.uiState);
     } else {
       return new Data(vis.data, vis._attr, vis.uiState);
     }