Graph: added log base 16 and log base 1024 scales, #452

CHANGELOG.md

@@ -7,7 +7,7 @@
 - [Issue #171](https://github.com/grafana/grafana/issues/171).   Panel: Different time periods, panels can override dashboard relative time and/or add a time shift
 - [Issue #1488](https://github.com/grafana/grafana/issues/1488). Dashboard: Clone dashboard / Save as
 - [Issue #1458](https://github.com/grafana/grafana/issues/1458). User: persisted user option for dark or light theme  (no longer an option on a dashboard)
-- [Issue #452](https://github.com/grafana/grafana/issues/452).   Graph: Adds logarithmic scale option (log base 10)
+- [Issue #452](https://github.com/grafana/grafana/issues/452).   Graph: Adds logarithmic scale option for base 10, base 16 and base 1024
 
 **Enhancements**
 - [Issue #1366](https://github.com/grafana/grafana/issues/1366). Graph & Singlestat: Support for additional units, Fahrenheit (°F) and Celsius (°C), Humidity (%H), kW, watt-hour (Wh), kilowatt-hour (kWh), velocities (m/s, km/h, mpg, knot)

src/app/panels/graph/graph.js

@@ -351,7 +351,7 @@ function (angular, $, kbn, moment, _, GraphTooltip) {
             show: scope.panel['y-axis'],
             min: scope.panel.grid.leftMin,
             index: 1,
-            logBase: scope.panel.grid.leftLogBase,
+            logBase: scope.panel.grid.leftLogBase || 1,
             max: scope.panel.percentage && scope.panel.stack ? 100 : scope.panel.grid.leftMax,
           };
 
@@ -360,7 +360,7 @@ function (angular, $, kbn, moment, _, GraphTooltip) {
           if (_.findWhere(data, {yaxis: 2})) {
             var secondY = _.clone(defaults);
             secondY.index = 2,
-            secondY.logBase = scope.panel.grid.rightLogBase;
+            secondY.logBase = scope.panel.grid.rightLogBase || 2,
             secondY.position = 'right';
             secondY.min = scope.panel.grid.rightMin;
             secondY.max = scope.panel.percentage && scope.panel.stack ? 100 : scope.panel.grid.rightMax;
@@ -375,7 +375,7 @@ function (angular, $, kbn, moment, _, GraphTooltip) {
         }
 
         function applyLogScale(axis, data) {
-          if (axis.logBase !== 10) {
+          if (axis.logBase === 1) {
             return;
           }
 
@@ -391,26 +391,30 @@ function (angular, $, kbn, moment, _, GraphTooltip) {
                 }
               }
             }
-
-            if (max === null) {
+            if (max === void 0) {
               max = Number.MAX_VALUE;
             }
           }
 
           axis.min = axis.min !== null ? axis.min : 1;
           axis.ticks = [1];
-          var tick = 1;
+          var nextTick = 1;
 
           while (true) {
-            tick = tick * axis.logBase;
-            axis.ticks.push(tick);
-            if (tick > max) {
+            nextTick = nextTick * axis.logBase;
+            axis.ticks.push(nextTick);
+            if (nextTick > max) {
               break;
             }
           }
 
-          axis.transform = function(v) { return Math.log(v+0.001); };
-          axis.inverseTransform  = function (v) { return Math.pow(10,v); };
+          if (axis.logBase === 10) {
+            axis.transform = function(v) { return Math.log(v+0.0001); };
+            axis.inverseTransform  = function (v) { return Math.pow(10,v); };
+          } else {
+            axis.transform = function(v) { return Math.log(v+0.0001) / Math.log(axis.logBase); };
+            axis.inverseTransform  = function (v) { return Math.pow(axis.logBase,v); };
+          }
         }
 
         function configureAxisMode(axis, format) {

src/app/panels/graph/module.js

@@ -116,7 +116,7 @@ function (angular, app, $, _, kbn, moment, TimeSeries, PanelMeta) {
     _.defaults($scope.panel.grid, _d.grid);
     _.defaults($scope.panel.legend, _d.legend);
 
-    $scope.logScales = {'linear': 1, 'log (base 10)': 10};
+    $scope.logScales = {'linear': 1, 'log (base 16)': 16, 'log (base 10)': 10, 'log (base 1024)': 1024};
 
     $scope.hiddenSeries = {};
     $scope.seriesList = [];

src/test/specs/graph-specs.js

@@ -28,7 +28,7 @@ define([
             scope.height = '200px';
             scope.panel = {
               legend: {},
-              grid: {},
+              grid: { },
               y_formats: [],
               seriesOverrides: [],
               tooltip: {
@@ -140,6 +140,25 @@ define([
       });
     });
 
+    graphScenario('when logBase is log 10', function(ctx) {
+      ctx.setup(function(scope) {
+        scope.panel.grid = {
+          leftMax: null,
+          rightMax: null,
+          leftMin: null,
+          rightMin: null,
+          leftLogBase: 10,
+        };
+      });
+
+      it('should apply axis transform and ticks', function() {
+        var axis = ctx.plotOptions.yaxes[0];
+        expect(axis.transform(100)).to.be(Math.log(100+0.0001));
+        expect(axis.ticks[0]).to.be(1);
+        expect(axis.ticks[1]).to.be(10);
+      });
+    });
+
     graphScenario('should use timeStep for barWidth', function(ctx) {
       ctx.setup(function(scope, data) {
         scope.panel.bars = true;