allow constraints with same axis letter

Author: alexcjohnson

src/plots/cartesian/constraint_defaults.js

@@ -13,12 +13,12 @@ var Lib = require('../../lib');
 var id2name = require('./axis_ids').id2name;
 
 
-module.exports = function handleConstraintDefaults(containerIn, containerOut, coerce, counterAxes, layoutOut) {
+module.exports = function handleConstraintDefaults(containerIn, containerOut, coerce, allAxisIds, layoutOut) {
     var constraintGroups = layoutOut._axisConstraintGroups;
 
     if(containerOut.fixedrange || !containerIn.scaleanchor) return;
 
-    var constraintOpts = getConstraintOpts(constraintGroups, containerOut._id, counterAxes, layoutOut);
+    var constraintOpts = getConstraintOpts(constraintGroups, containerOut._id, allAxisIds, layoutOut);
 
     var scaleanchor = Lib.coerce(containerIn, containerOut, {
         scaleanchor: {
@@ -39,26 +39,28 @@ module.exports = function handleConstraintDefaults(containerIn, containerOut, co
         updateConstraintGroups(constraintGroups, constraintOpts.thisGroup,
             containerOut._id, scaleanchor, scaleratio);
     }
-    else if(counterAxes.indexOf(containerIn.scaleanchor) !== -1) {
+    else if(allAxisIds.indexOf(containerIn.scaleanchor) !== -1) {
         Lib.warn('ignored ' + containerOut._name + '.scaleanchor: "' +
             containerIn.scaleanchor + '" to avoid either an infinite loop ' +
             'and possibly inconsistent scaleratios, or because the target' +
             'axis has fixed range.');
     }
 };
 
-function getConstraintOpts(constraintGroups, thisID, counterAxes, layoutOut) {
+function getConstraintOpts(constraintGroups, thisID, allAxisIds, layoutOut) {
     // If this axis is already part of a constraint group, we can't
     // scaleanchor any other axis in that group, or we'd make a loop.
-    // Filter counterAxes to enforce this, also matching axis types.
+    // Filter allAxisIds to enforce this, also matching axis types.
 
     var thisType = layoutOut[id2name(thisID)].type;
 
     var i, j, idj, axj;
 
     var linkableAxes = [];
-    for(j = 0; j < counterAxes.length; j++) {
-        idj = counterAxes[j];
+    for(j = 0; j < allAxisIds.length; j++) {
+        idj = allAxisIds[j];
+        if(idj === thisID) continue;
+
         axj = layoutOut[id2name(idj)];
         if(axj.type === thisType && !axj.fixedrange) linkableAxes.push(idj);
     }

src/plots/cartesian/dragbox.js

@@ -659,80 +659,88 @@ module.exports = function dragBox(gd, plotinfo, x, y, w, h, ns, ew) {
     // affected by this drag, and update them. look for all plots
     // sharing an affected axis (including the one being dragged)
     function updateSubplots(viewBox) {
-        var j;
-        var plotinfos = fullLayout._plots,
-            subplots = Object.keys(plotinfos);
+        var plotinfos = fullLayout._plots;
+        var subplots = Object.keys(plotinfos);
+        var xScaleFactor = viewBox[2] / xa[0]._length;
+        var yScaleFactor = viewBox[3] / ya[0]._length;
+        var editX = ew || isSubplotConstrained;
+        var editY = ns || isSubplotConstrained;
+
+        var i, xScaleFactor2, yScaleFactor2, clipDx, clipDy;
+
+        // Find the appropriate scaling for this axis, if it's linked to the
+        // dragged axes by constraints. 0 is special, it means this axis shouldn't
+        // ever be scaled (will be converted to 1 if the other axis is scaled)
+        function getLinkedScaleFactor(ax) {
+            if(ax.fixedrange) return 0;
+
+            if(editX && xaLinked.indexOf(ax) !== -1) {
+                return xScaleFactor;
+            }
+            if(editY && (isSubplotConstrained ? xaLinked : yaLinked).indexOf(ax) !== -1) {
+                return yScaleFactor;
+            }
+            return 0;
+        }
+
+        function scaleAndGetShift(ax, scaleFactor) {
+            if(scaleFactor) {
+                ax.range = ax._r.slice();
+                scaleZoom(ax, scaleFactor);
+                return ax._length * (1 - scaleFactor) / 2;
+            }
+            return 0;
+        }
 
-        for(var i = 0; i < subplots.length; i++) {
+        for(i = 0; i < subplots.length; i++) {
 
             var subplot = plotinfos[subplots[i]],
                 xa2 = subplot.xaxis,
                 ya2 = subplot.yaxis,
-                editX = (viewBox[0] !== 0 || viewBox[2] !== pw) && !xa2.fixedrange,
-                editY = (viewBox[1] !== 0 || viewBox[3] !== ph) && !ya2.fixedrange;
-
-            if(editX) {
-                // TODO: now that we're doing recomputeAxisLists can this be turned into
-                // just xa.indexOf(xa2) !== -1?
-                var isInX = false;
-                for(j = 0; j < xa.length; j++) {
-                    if(xa[j]._id === xa2._id) {
-                        isInX = true;
-                        break;
-                    }
-                }
-                editX = editX && isInX;
-            }
+                editX2 = editX && !xa2.fixedrange && (xa.indexOf(xa2) !== -1),
+                editY2 = editY && !ya2.fixedrange && (ya.indexOf(ya2) !== -1);
 
-            if(editY) {
-                var isInY = false;
-                for(j = 0; j < ya.length; j++) {
-                    if(ya[j]._id === ya2._id) {
-                        isInY = true;
-                        break;
-                    }
-                }
-                editY = editY && isInY;
+            if(editX2) {
+                xScaleFactor2 = xScaleFactor;
+                clipDx = viewBox[0];
+            }
+            else {
+                xScaleFactor2 = getLinkedScaleFactor(xa2);
+                clipDx = scaleAndGetShift(xa2, xScaleFactor2);
             }
 
-            var xScaleFactor = editX ? viewBox[2] / xa2._length : 1,
-                yScaleFactor = editY ? viewBox[3] / ya2._length : 1;
-
-            var clipDx = editX ? viewBox[0] : 0,
-                clipDy = editY ? viewBox[1] : 0;
-
-            // modify these if needed for linked axes
-            if(editX && !editY && xaLinked.indexOf(ya2) !== -1) {
-                yScaleFactor = xScaleFactor;
-                clipDy = ya2._length * (1 - yScaleFactor) / 2;
-
-                // update range for the linked axis.
-                ya2.range = ya2._r.slice();
-                scaleZoom(ya2, yScaleFactor);
+            if(editY2) {
+                yScaleFactor2 = yScaleFactor;
+                clipDy = viewBox[1];
             }
-            if(editY && !editX && (isSubplotConstrained ? xaLinked : yaLinked).indexOf(xa2) !== -1) {
-                xScaleFactor = yScaleFactor;
-                clipDx = xa2._length * (1 - xScaleFactor) / 2;
-                xa2.range = xa2._r.slice();
-                scaleZoom(xa2, xScaleFactor);
+            else {
+                yScaleFactor2 = getLinkedScaleFactor(ya2);
+                clipDy = scaleAndGetShift(ya2, yScaleFactor2);
             }
 
-            var plotDx = xa2._offset - clipDx / xScaleFactor,
-                plotDy = ya2._offset - clipDy / yScaleFactor;
+            // don't scale at all if neither axis is scalable here
+            if(!xScaleFactor2 && !yScaleFactor2) continue;
+
+            // but if only one is, reset the other axis scaling
+            if(!xScaleFactor2) xScaleFactor2 = 1;
+            if(!yScaleFactor2) yScaleFactor2 = 1;
+
+            var plotDx = xa2._offset - clipDx / xScaleFactor2,
+                plotDy = ya2._offset - clipDy / yScaleFactor2;
 
             fullLayout._defs.selectAll('#' + subplot.clipId)
                 .call(Drawing.setTranslate, clipDx, clipDy)
-                .call(Drawing.setScale, xScaleFactor, yScaleFactor);
+                .call(Drawing.setScale, xScaleFactor2, yScaleFactor2);
 
             subplot.plot
                 .call(Drawing.setTranslate, plotDx, plotDy)
-                .call(Drawing.setScale, 1 / xScaleFactor, 1 / yScaleFactor)
+                .call(Drawing.setScale, 1 / xScaleFactor2, 1 / yScaleFactor2)
 
                 // This is specifically directed at scatter traces, applying an inverse
                 // scale to individual points to counteract the scale of the trace
                 // as a whole:
                 .select('.scatterlayer').selectAll('.points').selectAll('.point')
-                    .call(Drawing.setPointGroupScale, xScaleFactor, yScaleFactor);
+                    .call(Drawing.setPointGroupScale, xScaleFactor2, yScaleFactor2);
         }
     }
 

src/plots/cartesian/layout_defaults.js

@@ -231,6 +231,7 @@ module.exports = function supplyLayoutDefaults(layoutIn, layoutOut, fullData) {
     // sets of axes linked by `scaleanchor` along with the scaleratios compounded
     // together, populated in handleConstraintDefaults
     layoutOut._axisConstraintGroups = [];
+    var allAxisIds = counterAxes.x.concat(counterAxes.y);
 
     for(i = 0; i < axesList.length; i++) {
         axName = axesList[i];
@@ -239,6 +240,6 @@ module.exports = function supplyLayoutDefaults(layoutIn, layoutOut, fullData) {
         axLayoutIn = layoutIn[axName];
         axLayoutOut = layoutOut[axName];
 
-        handleConstraintDefaults(axLayoutIn, axLayoutOut, coerce, counterAxes[axLetter], layoutOut);
+        handleConstraintDefaults(axLayoutIn, axLayoutOut, coerce, allAxisIds, layoutOut);
     }
 };

test/image/baselines/axes_scaleanchor.png

@@ -1,15 +1,20 @@
 {
   "data":[
     {"x": [0,1,1,0,0,1,1,2,2,3,3,2,2,3], "y": [0,0,1,1,3,3,2,2,3,3,1,1,0,0]},
-    {"x": [0,1,2,3], "y": [1,2,4,8], "yaxis":"y2"}
+    {"x": [0,1,2,3], "y": [1,2,4,8], "yaxis":"y2"},
+    {"x": [1,10,100,10,1], "y": [0,1,2,3,4], "xaxis":"x2", "yaxis":"y3"},
+    {"x": [1,100,30,80,1], "y": [1,1.5,2,2.5,3], "xaxis":"x2", "yaxis":"y4"}
   ],
   "layout":{
-    "width": 600,
-    "height":600,
+    "width": 800,
+    "height":500,
     "title": "fixed-ratio axes",
-    "xaxis": {"nticks": 10, "title": "shared X axis"},
+    "xaxis": {"nticks": 10, "domain": [0, 0.45], "title": "shared X axis"},
     "yaxis": {"scaleanchor": "x", "domain": [0, 0.45], "title": "1:1"},
     "yaxis2": {"scaleanchor": "x", "scaleratio": 0.2, "domain": [0.55,1], "title": "1:5"},
+    "xaxis2": {"type": "log", "domain": [0.55, 1], "title": "unconstrained log X"},
+    "yaxis3": {"domain": [0, 0.45], "anchor": "x2", "title": "Scale matches ->"},
+    "yaxis4": {"scaleanchor": "y3", "domain": [0.55, 1], "anchor": "x2", "title": "Scale matches <-"},
     "showlegend": false
   }
 }

test/image/mocks/axes_scaleanchor.json

@@ -475,18 +475,21 @@ describe('Test axes', function() {
 
             layoutIn = {
                 xaxis: {scaleanchor: 'y', scaleratio: 2},
-                yaxis: {scaleanchor: 'x', scaleratio: 3},
+                yaxis: {scaleanchor: 'x', scaleratio: 3}, // dropped loop
 
                 xaxis2: {scaleanchor: 'y2', scaleratio: 5},
                 yaxis2: {scaleanchor: 'x3', scaleratio: 7},
                 xaxis3: {scaleanchor: 'y3', scaleratio: 9},
-                yaxis3: {scaleanchor: 'x2', scaleratio: 11}
+                yaxis3: {scaleanchor: 'x2', scaleratio: 11}, // dropped loop
+
+                xaxis4: {scaleanchor: 'x', scaleratio: 13}, // x<->x is OK now
+                yaxis4: {scaleanchor: 'y', scaleratio: 17}, // y<->y is OK now
             };
 
             supplyLayoutDefaults(layoutIn, layoutOut, fullData);
 
             expect(layoutOut._axisConstraintGroups).toEqual([
-                {x: 2, y: 1},
+                {x: 2, y: 1, x4: 2 * 13, y4: 17},
                 {x2: 5 * 7 * 9, y2: 7 * 9, y3: 1, x3: 9}
             ]);
 
@@ -507,7 +510,7 @@ describe('Test axes', function() {
             });
 
             layoutIn = {
-                xaxis: {scaleanchor: 'x2', scaleratio: 2}, // must be opposite letter
+                xaxis: {scaleanchor: 'x', scaleratio: 2}, // can't link to itself
                 yaxis: {scaleanchor: 'x4', scaleratio: 3}, // doesn't exist
                 xaxis2: {scaleanchor: 'yaxis', scaleratio: 5} // must be an id, not a name
             };