Refactoring code. Change Y-Zero to Y-Level.

public/app/plugins/panel/graph/axes_editor.html

@@ -29,7 +29,6 @@
 					<input type="text" class="gf-form-input width-5" placeholder="auto" empty-to-null ng-model="yaxis.max" ng-change="ctrl.render()" ng-model-onblur>
 				</div>
       </div>
-                        <gf-form-switch class="gf-form" label="Share Zero" label-class="width-6" checked="yaxis.shareZero" on-change="ctrl.render()" ng-show="$index === 1"></gf-form-switch>
       <div class="gf-form">
 				<label class="gf-form-label width-6">Decimals</label>
 				<input type="number" class="gf-form-input max-width-20" placeholder="auto" empty-to-null bs-tooltip="'Override automatic decimal precision for y-axis'" data-placement="right" ng-model="yaxis.decimals" ng-change="ctrl.render()" ng-model-onblur>
@@ -40,6 +39,13 @@
 				<input type="text" class="gf-form-input max-width-20" ng-model="yaxis.label" ng-change="ctrl.render()" ng-model-onblur>
 			</div>
 		</div>
+		<div class="gf-form-inline">
+			<gf-form-switch class="gf-form" label="Share Y" label-class="width-6" checked="yaxis.shareLevel" on-change="ctrl.render()" ng-show="$index === 1"></gf-form-switch>
+			<div class="gf-form" ng-if="yaxis.shareLevel">
+				<label class="gf-form-label width-6">Y level</label>
+				<input type="text" class="gf-form-input width-5" placeholder="0" empty-to-null ng-model="yaxis.shareY" ng-change="ctrl.render()" ng-model-onblur ng-init="yaxis.shareY = yaxis.shareY || 0">
+			</div>
+		</div>
 	</div>
 
 	<div class="section gf-form-group">

public/app/plugins/panel/graph/graph.ts

@@ -157,12 +157,17 @@ function graphDirective(timeSrv, popoverSrv, contextSrv) {
 
       function processRangeHook(plot) {
         var yaxis = plot.getYAxes();
-        if (yaxis.length > 1 && panel.yaxes[1].shareZero) {
+        if (yaxis.length > 1 && panel.yaxes[1].shareLevel) {
-          shareYLevel(yaxis[0].min, yaxis[0].max, yaxis[1].min, yaxis[1].max, 0);
+          shareYLevel(yaxis, parseFloat(panel.yaxes[1].shareY || 0));
         }
       }
 
-      function shareYLevel(minLeft, maxLeft, minRight, maxRight, shareLevel) {
+      function shareYLevel(yaxis, shareLevel) {
+        var minLeft = yaxis[0].min;
+        var maxLeft = yaxis[0].max;
+        var minRight = yaxis[1].min;
+        var maxRight = yaxis[1].max;
+
         if (shareLevel !== 0) {
           minLeft -= shareLevel;
           maxLeft -= shareLevel;
@@ -183,76 +188,80 @@ function graphDirective(timeSrv, popoverSrv, contextSrv) {
           maxRight += wideFactor;
         }
 
-        // on the opposite sides with respect to zero
+        // one of graphs on zero
-        if ((minLeft >= 0 && maxRight <= 0) || (maxLeft <= 0 && minRight >= 0)) {
+        var zero = minLeft === 0 || minRight === 0 || maxLeft === 0 || maxRight === 0;
-          if (minLeft >= 0) {
+
-            minLeft = -maxLeft;
+        // on the one hand with respect to zero
-            maxRight = -minRight;
+        var oneSide = (minLeft >= 0 && minRight >= 0) || (maxLeft <= 0 && maxRight <= 0);
-          } else {
+
-            maxLeft = -minLeft;
+        if (zero && oneSide) {
-            minRight = -maxRight;
+          minLeft = maxLeft > 0 ? 0 : minLeft;
-          }
+          maxLeft = maxLeft > 0 ? maxLeft : 0;
+          minRight = maxRight > 0 ? 0 : minRight;
+          maxRight = maxRight > 0 ? maxRight : 0;
         } else {
-          var limitTop = Infinity;
+          // on the opposite sides with respect to zero
-          var limitBottom = -Infinity;
+          if ((minLeft >= 0 && maxRight <= 0) || (maxLeft <= 0 && minRight >= 0)) {
-          var absLeftMin = Math.abs(minLeft);
+            if (minLeft >= 0) {
-          var absLeftMax = Math.abs(maxLeft);
+              minLeft = -maxLeft;
-          var absRightMin = Math.abs(minRight);
+              maxRight = -minRight;
-          var absRightMax = Math.abs(maxRight);
+            } else {
-          var upLeft = _.max([absLeftMin, absLeftMax]);
+              maxLeft = -minLeft;
-          var downLeft = _.min([absLeftMin, absLeftMax]);
+              minRight = -maxRight;
-          var upRight = _.max([absRightMin, absRightMax]);
+            }
-          var downRight = _.min([absRightMin, absRightMax]);
+          } else {
-          var oneSide = (minLeft >= 0 && minRight >= 0) || (maxLeft <= 0 && maxRight <= 0);
+            // both across zero
-          var rateLeft, rateRight, rate;
+            var twoCross = minLeft <= 0 && maxLeft >= 0 && minRight <= 0 && maxRight >= 0;
-
+
-          // on the one hand with respect to zero
+            var rateLeft, rateRight, rate;
-          if (oneSide) {
+            if (twoCross) {
-            rateLeft = downLeft ? upLeft / downLeft : downLeft >= 0 ? limitTop : limitBottom;
+              rateLeft = minRight ? minLeft / minRight : 0;
-            rateRight = downRight ? upRight / downRight : downRight >= 0 ? limitTop : limitBottom;
+              rateRight = maxRight ? maxLeft / maxRight : 0;
-            rate = _.max([rateLeft, rateRight]);
-
-            if (rate === limitTop) {
-              if (maxLeft > 0) {
-                minLeft = 0;
-                minRight = 0;
-              } else {
-                maxLeft = 0;
-                maxRight = 0;
-              }
             } else {
-              var coef = deltaLeft / deltaRight;
+              if (oneSide) {
-              if ((rate === rateLeft && minLeft > 0) || (rate === rateRight && maxRight < 0)) {
+                var absLeftMin = Math.abs(minLeft);
-                maxLeft = maxRight * coef;
+                var absLeftMax = Math.abs(maxLeft);
-                minRight = minLeft / coef;
+                var absRightMin = Math.abs(minRight);
+                var absRightMax = Math.abs(maxRight);
+                var upLeft = _.max([absLeftMin, absLeftMax]);
+                var downLeft = _.min([absLeftMin, absLeftMax]);
+                var upRight = _.max([absRightMin, absRightMax]);
+                var downRight = _.min([absRightMin, absRightMax]);
+
+                rateLeft = downLeft ? upLeft / downLeft : upLeft;
+                rateRight = downRight ? upRight / downRight : upRight;
               } else {
-                minLeft = minRight * coef;
+                if (minLeft > 0 || minRight > 0) {
-                maxRight = maxLeft / coef;
+                  rateLeft = maxLeft / maxRight;
+                  rateRight = 0;
+                } else {
+                  rateLeft = 0;
+                  rateRight = minLeft / minRight;
+                }
               }
             }
-          } else {
+            rate = rateLeft > rateRight ? rateLeft : rateRight;
-            rateLeft =
+
-              minLeft && maxLeft
+            if (oneSide) {
-                ? minLeft < 0 ? maxLeft / minLeft : limitBottom
+              if (minLeft > 0) {
-                : minLeft < 0 || maxRight >= 0 ? limitBottom : limitTop;
+                minLeft = maxLeft / rate;
-            rateRight =
+                minRight = maxRight / rate;
-              minRight && maxRight
+              } else {
-                ? minRight < 0 ? maxRight / minRight : limitBottom
+                maxLeft = minLeft / rate;
-                : minRight < 0 || maxLeft >= 0 ? limitBottom : limitTop;
+                maxRight = minRight / rate;
-            rate = _.max([rateLeft, rateRight]);
+              }
-
-            if (rate === rateLeft) {
-              minRight =
-                upRight === absRightMin && (absRightMin !== absRightMax || upLeft !== absLeftMin)
-                  ? -upRight
-                  : upRight / rate;
-              maxRight = upRight === absRightMax ? upRight : -upRight * rate;
             } else {
-              minLeft =
+              if (twoCross) {
-                upLeft === absLeftMin && (absLeftMin !== absLeftMax || upRight !== absRightMin)
+                minLeft = minRight ? minRight * rate : minLeft;
-                  ? -upLeft
+                minRight = minLeft ? minLeft / rate : minRight;
-                  : upLeft / rate;
+                maxLeft = maxRight ? maxRight * rate : maxLeft;
-              maxLeft = upLeft === absLeftMax ? upLeft : -upLeft * rate;
+                maxRight = maxLeft ? maxLeft / rate : maxRight;
+              } else {
+                minLeft = minLeft > 0 ? minRight * rate : minLeft;
+                minRight = minRight > 0 ? minLeft / rate : minRight;
+                maxLeft = maxLeft < 0 ? maxRight * rate : maxLeft;
+                maxRight = maxRight < 0 ? maxLeft / rate : maxRight;
+              }
             }
           }
         }
@@ -263,6 +272,11 @@ function graphDirective(timeSrv, popoverSrv, contextSrv) {
           minRight += shareLevel;
           maxRight += shareLevel;
         }
+
+        yaxis[0].min = minLeft;
+        yaxis[0].max = maxLeft;
+        yaxis[1].min = minRight;
+        yaxis[1].max = maxRight;
       }
 
       // Series could have different timeSteps,

public/app/plugins/panel/graph/module.ts

@@ -46,6 +46,8 @@ class GraphCtrl extends MetricsPanelCtrl {
         min: null,
         max: null,
         format: 'short',
+        shareLevel: false,
+        shareY: 0,
       },
     ],
     xaxis: {

public/vendor/flot/jquery.flot.js

@@ -1622,14 +1622,24 @@ Licensed under the MIT license.
                     return axis.show || axis.reserveSpace;
                 });
 
-                $.each(allocatedAxes, function (_, axis) {
+                var snaped = false;
-                    // make the ticks
+                for (var i = 0; i < 2; i++) {
-                    setupTickGeneration(axis);
+                    $.each(allocatedAxes, function (_, axis) {
-                    setTicks(axis);
+                        // make the ticks
-                    snapRangeToTicks(axis, axis.ticks);
+                        setupTickGeneration(axis);
-                    // find labelWidth/Height for axis
+                        setTicks(axis);
-                    measureTickLabels(axis);
+                        snaped = snapRangeToTicks(axis, axis.ticks) || snaped;
-                });
+                        // find labelWidth/Height for axis
+                        measureTickLabels(axis);
+                    });
+
+                    if (snaped) {
+                        executeHooks(hooks.processRange, []);
+                        snaped = false;
+                    } else {
+                        break;
+                    }
+                }
 
                 // with all dimensions calculated, we can compute the
                 // axis bounding boxes, start from the outside
@@ -1646,6 +1656,7 @@ Licensed under the MIT license.
                 });
             }
 
+
             plotWidth = surface.width - plotOffset.left - plotOffset.right;
             plotHeight = surface.height - plotOffset.bottom - plotOffset.top;
 
@@ -1879,13 +1890,19 @@ Licensed under the MIT license.
         }
 
         function snapRangeToTicks(axis, ticks) {
+            var changed = false;
             if (axis.options.autoscaleMargin && ticks.length > 0) {
                 // snap to ticks
-                if (axis.options.min == null)
+                if (axis.options.min == null) {
                     axis.min = Math.min(axis.min, ticks[0].v);
-                if (axis.options.max == null && ticks.length > 1)
+                    changed = true;
+                }
+                if (axis.options.max == null && ticks.length > 1) {
                     axis.max = Math.max(axis.max, ticks[ticks.length - 1].v);
+                    changed = true;
+                }
             }
+            return changed;
         }
 
         function draw() {