Merge remote-tracking branch 'origin/master' into fix5292-unified-hover

Author: archmoj

package-lock.json

@@ -1029,10 +1029,10 @@ function createHoverText(hoverData, opts, gd) {
         };
         var mockLayoutOut = {};
         legendSupplyDefaults(mockLayoutIn, mockLayoutOut, gd._fullData);
-        var legendOpts = mockLayoutOut.legend;
+        var mockLegend = mockLayoutOut.legend;
 
         // prepare items for the legend
-        legendOpts.entries = [];
+        mockLegend.entries = [];
         for(var j = 0; j < hoverData.length; j++) {
             var texts = getHoverLabelText(hoverData[j], true, hovermode, fullLayout, t0);
             var text = texts[0];
@@ -1058,13 +1058,14 @@ function createHoverText(hoverData, opts, gd) {
             }
             pt._distinct = true;
 
-            legendOpts.entries.push([pt]);
+            mockLegend.entries.push([pt]);
         }
-        legendOpts.entries.sort(function(a, b) { return a[0].trace.index - b[0].trace.index;});
-        legendOpts.layer = container;
+        mockLegend.entries.sort(function(a, b) { return a[0].trace.index - b[0].trace.index;});
+        mockLegend.layer = container;
 
         // Draw unified hover label
-        legendDraw(gd, legendOpts);
+        mockLegend._inHover = true;
+        legendDraw(gd, mockLegend);
 
         // Position the hover
         var ly = Lib.mean(hoverData.map(function(c) {return (c.y0 + c.y1) / 2;}));

src/components/fx/hover.js

@@ -11,7 +11,6 @@ module.exports = function getLegendData(calcdata, opts) {
     var lgroupi = 0;
     var maxNameLength = 0;
     var i, j;
-    var main = opts._main;
 
     function addOneItem(legendGroup, legendItem) {
         // each '' legend group is treated as a separate group
@@ -37,7 +36,7 @@ module.exports = function getLegendData(calcdata, opts) {
         var trace = cd0.trace;
         var lgroup = trace.legendgroup;
 
-        if(main && (!trace.visible || !trace.showlegend)) continue;
+        if(!opts._inHover && (!trace.visible || !trace.showlegend)) continue;
 
         if(Registry.traceIs(trace, 'pie-like')) {
             if(!slicesShown[lgroup]) slicesShown[lgroup] = {};

src/components/legend/draw.js

@@ -34,6 +34,11 @@ var ONESEC = constants.ONESEC;
 var MINUS_SIGN = constants.MINUS_SIGN;
 var BADNUM = constants.BADNUM;
 
+var ZERO_PATH = { K: 'zeroline' };
+var GRID_PATH = { K: 'gridline', L: 'path' };
+var TICK_PATH = { K: 'tick', L: 'path' };
+var TICK_TEXT = { K: 'tick', L: 'text' };
+
 var alignmentConstants = require('../../constants/alignment');
 var MID_SHIFT = alignmentConstants.MID_SHIFT;
 var CAP_SHIFT = alignmentConstants.CAP_SHIFT;
@@ -1449,7 +1454,7 @@ function formatDate(ax, out, hover, extraPrecision) {
                 ax._prevDateHead = headStr;
                 dateStr += '<br>' + headStr;
             } else {
-                var isInside = (ax.ticklabelposition || '').indexOf('inside') !== -1;
+                var isInside = insideTicklabelposition(ax);
                 var side = ax._realSide || ax.side; // polar mocks the side of the radial axis
                 if(
                     (!isInside && side === 'top') ||
@@ -2180,6 +2185,7 @@ axes.drawOne = function(gd, ax, opts) {
         return axes.drawLabels(gd, ax, {
             vals: vals,
             layer: mainAxLayer,
+            plotinfo: plotinfo,
             transFn: transTickLabelFn,
             labelFns: axes.makeLabelFns(ax, mainLinePosition)
         });
@@ -2798,7 +2804,10 @@ axes.drawTicks = function(gd, ax, opts) {
         .classed('crisp', opts.crisp !== false)
         .call(Color.stroke, ax.tickcolor)
         .style('stroke-width', Drawing.crispRound(gd, ax.tickwidth, 1) + 'px')
-        .attr('d', opts.path);
+        .attr('d', opts.path)
+        .style('display', null); // visible
+
+    hideCounterAxisInsideTickLabels(ax, [TICK_PATH]);
 
     ticks.attr('transform', opts.transFn);
 };
@@ -2861,7 +2870,10 @@ axes.drawGrid = function(gd, ax, opts) {
     grid.attr('transform', opts.transFn)
         .attr('d', opts.path)
         .call(Color.stroke, ax.gridcolor || '#ddd')
-        .style('stroke-width', ax._gw + 'px');
+        .style('stroke-width', ax._gw + 'px')
+        .style('display', null); // visible
+
+    hideCounterAxisInsideTickLabels(ax, [GRID_PATH]);
 
     if(typeof opts.path === 'function') grid.attr('d', opts.path);
 };
@@ -2910,7 +2922,10 @@ axes.drawZeroLine = function(gd, ax, opts) {
     zl.attr('transform', opts.transFn)
         .attr('d', opts.path)
         .call(Color.stroke, ax.zerolinecolor || Color.defaultLine)
-        .style('stroke-width', Drawing.crispRound(gd, ax.zerolinewidth, ax._gw || 1) + 'px');
+        .style('stroke-width', Drawing.crispRound(gd, ax.zerolinewidth, ax._gw || 1) + 'px')
+        .style('display', null); // visible
+
+    hideCounterAxisInsideTickLabels(ax, [ZERO_PATH]);
 };
 
 /**
@@ -2983,7 +2998,10 @@ axes.drawLabels = function(gd, ax, opts) {
                     // sync label: just position it now.
                     positionLabels(thisLabel, tickAngle);
                 }
-            });
+            })
+            .style('display', null); // visible
+
+    hideCounterAxisInsideTickLabels(ax, [TICK_TEXT]);
 
     tickLabels.exit().remove();
 
@@ -2995,7 +3013,7 @@ axes.drawLabels = function(gd, ax, opts) {
     }
 
     function positionLabels(s, angle) {
-        var isInside = (ax.ticklabelposition || '').indexOf('inside') !== -1;
+        var isInside = insideTicklabelposition(ax);
 
         s.each(function(d) {
             var thisLabel = d3.select(this);
@@ -3025,8 +3043,7 @@ axes.drawLabels = function(gd, ax, opts) {
                 });
 
                 if(isInside) {
-                    // ensure visible
-                    thisText.style({ opacity: 100 });
+                    thisText.style('opacity', 1); // visible
 
                     if(ax._hideOutOfRangeInsideTickLabels) {
                         ax._hideOutOfRangeInsideTickLabels();
@@ -3040,9 +3057,8 @@ axes.drawLabels = function(gd, ax, opts) {
         });
     }
 
-    ax._hideOutOfRangeInsideTickLabels = undefined;
-    if((ax.ticklabelposition || '').indexOf('inside') !== -1) {
-        ax._hideOutOfRangeInsideTickLabels = function() {
+    ax._hideOutOfRangeInsideTickLabels = function() {
+        if(insideTicklabelposition(ax)) {
             var rl = Lib.simpleMap(ax.range, ax.r2l);
 
             // hide inside tick labels that go outside axis end points
@@ -3052,8 +3068,12 @@ axes.drawLabels = function(gd, ax, opts) {
             var min = Math.min(p0, p1) + ax._offset;
             var max = Math.max(p0, p1) + ax._offset;
 
+            var side = ax.side;
             var isX = ax._id.charAt(0) === 'x';
 
+            var visibleLabelMin = Infinity;
+            var visibleLabelMax = -Infinity;
+
             tickLabels.each(function(d) {
                 var thisLabel = d3.select(this);
                 var mathjaxGroup = thisLabel.select('.text-math-group');
@@ -3068,11 +3088,69 @@ axes.drawLabels = function(gd, ax, opts) {
                         if(bb.bottom > max) hide = true;
                         else if(bb.top + (ax.tickangle ? 0 : d.fontSize / 4) < min) hide = true;
                     }
-                    if(hide) thisLabel.select('text').style({ opacity: 0 });
+
+                    var t = thisLabel.select('text');
+                    if(hide) {
+                        t.style('opacity', 0); // hidden
+                    } else {
+                        t.style('opacity', 1); // visible
+
+                        if(side === 'bottom' || side === 'right') {
+                            visibleLabelMin = Math.min(visibleLabelMin, isX ? bb.top : bb.left);
+                        } else {
+                            visibleLabelMin = -Infinity;
+                        }
+
+                        if(side === 'top' || side === 'left') {
+                            visibleLabelMax = Math.max(visibleLabelMax, isX ? bb.bottom : bb.right);
+                        } else {
+                            visibleLabelMax = Infinity;
+                        }
+                    }
                 } // TODO: hide mathjax?
             });
-        };
-    }
+
+            if(ax._anchorAxis) {
+                ax._anchorAxis._visibleLabelMin = visibleLabelMin;
+                ax._anchorAxis._visibleLabelMax = visibleLabelMax;
+            }
+        }
+    };
+
+    ax._hideCounterAxisInsideTickLabels = function(partialOpts) {
+        if(insideTicklabelposition(ax._anchorAxis || {})) {
+            (partialOpts || [
+                ZERO_PATH,
+                GRID_PATH,
+                TICK_PATH,
+                TICK_TEXT
+            ]).forEach(function(e) {
+                var isTickText = e.K === 'tick' && e.L === 'text';
+                if(isTickText && ax.ticklabelmode === 'period') return;
+
+                var sel;
+                if(e.K === ZERO_PATH.K) sel = opts.plotinfo.zerolinelayer.selectAll('.' + ax._id + 'zl');
+                else if(e.K === GRID_PATH.K) sel = opts.plotinfo.gridlayer.selectAll('.' + ax._id);
+                else sel = opts.plotinfo[ax._id.charAt(0) + 'axislayer'];
+
+                sel.each(function() {
+                    var w = d3.select(this);
+                    if(e.L) w = w.selectAll(e.L);
+
+                    w.each(function(d) {
+                        var q = ax.l2p(d.x) + ax._offset;
+
+                        var t = d3.select(this);
+                        if(q < ax._visibleLabelMax && q > ax._visibleLabelMin) {
+                            t.style('display', 'none'); // hidden
+                        } else if(e.K === 'tick') {
+                            t.style('display', null); // visible
+                        }
+                    });
+                });
+            });
+        }
+    };
 
     // make sure all labels are correctly positioned at their base angle
     // the positionLabels call above is only for newly drawn labels.
@@ -3201,7 +3279,7 @@ axes.drawLabels = function(gd, ax, opts) {
     var anchorAx = ax._anchorAxis;
     if(
         anchorAx && anchorAx.autorange &&
-        (ax.ticklabelposition || '').indexOf('inside') !== -1 &&
+        insideTicklabelposition(ax) &&
         !isLinked(fullLayout, ax._id)
     ) {
         if(!fullLayout._insideTickLabelsAutorange) {
@@ -3350,7 +3428,7 @@ function drawTitle(gd, ax) {
     if(ax.title.hasOwnProperty('standoff')) {
         titleStandoff = ax._depth + ax.title.standoff + approxTitleDepth(ax);
     } else {
-        var isInside = (ax.ticklabelposition || '').indexOf('inside') !== -1;
+        var isInside = insideTicklabelposition(ax);
 
         if(ax.type === 'multicategory') {
             titleStandoff = ax._depth;
@@ -3708,3 +3786,15 @@ function moveOutsideBreak(v, ax) {
     }
     return v;
 }
+
+function insideTicklabelposition(ax) {
+    return ((ax.ticklabelposition || '').indexOf('inside') !== -1);
+}
+
+function hideCounterAxisInsideTickLabels(ax, opts) {
+    if(insideTicklabelposition(ax._anchorAxis || {})) {
+        if(ax._hideCounterAxisInsideTickLabels) {
+            ax._hideCounterAxisInsideTickLabels(opts);
+        }
+    }
+}

src/components/legend/get_legend_data.js

@@ -2076,17 +2076,21 @@ plots.doAutoMargin = function(gd) {
         }
     }
 
-    hideOutOfRangeInsideTickLabels(gd);
+    hideInsideTickLabels(gd);
 };
 
-function hideOutOfRangeInsideTickLabels(gd) {
+function hideInsideTickLabels(gd) {
     var axList = axisIDs.list(gd, '', true);
-    for(var i = 0; i < axList.length; i++) {
-        var ax = axList[i];
 
-        var hideFn = ax._hideOutOfRangeInsideTickLabels;
-        if(hideFn) hideFn();
-    }
+    [
+        '_hideOutOfRangeInsideTickLabels',
+        '_hideCounterAxisInsideTickLabels'
+    ].forEach(function(k) {
+        for(var i = 0; i < axList.length; i++) {
+            var hideFn = axList[i][k];
+            if(hideFn) hideFn();
+        }
+    });
 }
 
 var marginKeys = ['l', 'r', 't', 'b', 'p', 'w', 'h'];

src/plots/cartesian/axes.js

@@ -85,10 +85,6 @@ module.exports = function supplyDefaults(traceIn, traceOut, defaultColor, layout
     coerce('marker.pad.r', headerSize / 4);
     coerce('marker.pad.b', bottomText ? headerSize : headerSize / 4);
 
-    if(withColorscale) {
-        colorscaleDefaults(traceIn, traceOut, layout, coerce, {prefix: 'marker.', cLetter: 'c'});
-    }
-
     traceOut._hovered = {
         marker: {
             line: {