yaxis tick formatters

elastic · Jan 13, 2017 · af24338 · af24338
1 parent 840df9a
commit af24338
Show file tree

Hide file tree

Showing 3 changed files with 87 additions and 3 deletions.
diff --git a/src/core_plugins/timelion/public/panels/timechart/schema.js b/src/core_plugins/timelion/public/panels/timechart/schema.js
@@ -15,6 +15,7 @@ module.exports = function timechartFn(Private, config, $rootScope, timefilter, $
       render: function ($scope, $elem) {
         const template = '<div class="chart-top-title"></div><div class="chart-canvas"></div>';
         const timezone = Private(require('plugins/timelion/services/timezone'))();
+        const tickFormatters = require('plugins/timelion/services/tick_formatters')();
         const getxAxisFormatter = Private(require('plugins/timelion/panels/timechart/xaxis_formatter'));
 
         // TODO: I wonder if we should supply our own moment that sets this every time?
@@ -147,7 +148,11 @@ module.exports = function timechartFn(Private, config, $rootScope, timefilter, $
             }
 
             if (y != null) {
-              legendValueNumbers.eq(i).text('(' + y.toFixed(precision) + ')');
+              let label = y.toFixed(precision);
+              if (series.yaxis.tickFormatter) {
+                label = series.yaxis.tickFormatter(label, series.yaxis);
+              }
+              legendValueNumbers.eq(i).text(`(${label})`);
             } else {
               legendValueNumbers.eq(i).empty();
             }
@@ -219,6 +224,12 @@ module.exports = function timechartFn(Private, config, $rootScope, timefilter, $
                 if (objVal == null) return srcVal;
                 if (srcVal == null) return objVal;
               });
+
+              _.forEach(options.yaxes, yaxis => {
+                if (yaxis.units) {
+                  yaxis.tickFormatter = tickFormatters[yaxis.units[0]];
+                }
+              });
             }
 
             return series;

diff --git a/src/core_plugins/timelion/public/services/tick_formatters.js b/src/core_plugins/timelion/public/services/tick_formatters.js
@@ -0,0 +1,53 @@
+define(function (require) {
+
+  return function ticketFormatters() {
+    var formatters =  {
+      'bits': function (val, axis) {
+        var labels = ['b','kb','mb','gb','tb','pb'];
+        var index = 0;
+        while (val > 1000 && index < labels.length) {
+          val /= 1000;
+          index++;
+        }
+        return (Math.round(val * 100) / 100) + labels[index];
+      },
+      'bits/s': function (val, axis) {
+        var labels = ['b/s','kb/s','mb/s','gb/s','tb/s','pb/s'];
+        var index = 0;
+        while (val > 1000 && index < labels.length) {
+          val /= 1000;
+          index++;
+        }
+        return (Math.round(val * 100) / 100) + labels[index];
+      },
+      'bytes': function (val, axis) {
+        var labels = ['B','KB','MB','GB','TB','PB'];
+        var index = 0;
+        while (val > 1024 && index < labels.length) {
+          val /= 1024;
+          index++;
+        }
+        return (Math.round(val * 100) / 100) + labels[index];
+      },
+      'bytes/s': function (val, axis) {
+        var labels = ['B/s','KB/s','MB/s','GB/s','TB/s','PB/s'];
+        var index = 0;
+        while (val > 1024 && index < labels.length) {
+          val /= 1024;
+          index++;
+        }
+        return (Math.round(val * 100) / 100) + labels[index];
+      },
+      'currency': function (val, axis) {
+        return val.toLocaleString('en', { style: 'currency', currency: axis.options.units[1] });
+      },
+      'custom': function (val, axis) {
+        var prefix = axis.options._units[1] || '';
+        var suffix = axis.options._units[2] || '';
+        return prefix + val + suffix;
+      }
+    };
+
+    return formatters;
+  };
+});
diff --git a/src/core_plugins/timelion/server/series_functions/yaxis.js b/src/core_plugins/timelion/server/series_functions/yaxis.js
@@ -1,6 +1,15 @@
+import _ from 'lodash';
 const alter = require('../lib/alter.js');
 
 const Chainable = require('../lib/classes/chainable');
+const tickFormatters = {
+  'bits':'bits',
+  'bits/s':'bits/s',
+  'bytes':'bytes',
+  'bytes/s':'bytes/s',
+  'currency':'currency(:prefix)',
+  'custom':'custom(:prefix:suffix)'
+};
 module.exports = new Chainable('yaxis', {
   args: [
     {
@@ -37,10 +46,15 @@ module.exports = new Chainable('yaxis', {
       types: ['string', 'null'],
       help: 'Color of axis label'
     },
+    {
+      name: 'units',
+      types: ['string', 'null'],
+      help: 'The function to use for formatting y-axis labels. One of: ' + _.values(tickFormatters).join(', ')
+    },
   ],
   help: 'Configures a variety of y-axis options, the most important likely being the ability to add an Nth (eg 2nd) y-axis',
   fn: function yaxisFn(args) {
-    return alter(args, function (eachSeries, yaxis, min, max, position, label, color) {
+    return alter(args, function (eachSeries, yaxis, min, max, position, label, color, units) {
       yaxis = yaxis || 1;
 
       eachSeries.yaxis = yaxis;
@@ -58,7 +72,13 @@ module.exports = new Chainable('yaxis', {
       myAxis.axisLabelColour = color;
       myAxis.axisLabelUseCanvas = true;
 
-
+      if (units) {
+        var unitTokens = units.split(':');
+        if (!tickFormatters[unitTokens[0]]) {
+          throw new Error (`${units} is not a supported unit type.`);
+        }
+        myAxis.units = unitTokens;
+      }
 
       return eachSeries;
     });