diff --git a/src/components/drawing/index.js b/src/components/drawing/index.js index b949d8d8393..deec3efdf85 100644 --- a/src/components/drawing/index.js +++ b/src/components/drawing/index.js @@ -92,21 +92,27 @@ drawing.translatePoints = function(s, xa, ya) { }); }; -drawing.hideOutsideRangePoint = function(d, sel, xa, ya) { +drawing.hideOutsideRangePoint = function(d, sel, xa, ya, xcalendar, ycalendar) { sel.attr( 'display', - xa.isPtWithinRange(d) && ya.isPtWithinRange(d) ? null : 'none' + (xa.isPtWithinRange(d, xcalendar) && ya.isPtWithinRange(d, ycalendar)) ? null : 'none' ); }; -drawing.hideOutsideRangePoints = function(points, subplot) { +drawing.hideOutsideRangePoints = function(traceGroups, subplot) { if(!subplot._hasClipOnAxisFalse) return; var xa = subplot.xaxis; var ya = subplot.yaxis; - points.each(function(d) { - drawing.hideOutsideRangePoint(d, d3.select(this), xa, ya); + traceGroups.each(function(d) { + var trace = d[0].trace; + var xcalendar = trace.xcalendar; + var ycalendar = trace.ycalendar; + + traceGroups.selectAll('.point,.textpoint').each(function(d) { + drawing.hideOutsideRangePoint(d, d3.select(this), xa, ya, xcalendar, ycalendar); + }); }); }; diff --git a/src/plots/cartesian/dragbox.js b/src/plots/cartesian/dragbox.js index 4a81f4a625f..06b8e24c072 100644 --- a/src/plots/cartesian/dragbox.js +++ b/src/plots/cartesian/dragbox.js @@ -751,21 +751,21 @@ module.exports = function dragBox(gd, plotinfo, x, y, w, h, ns, ew) { .call(Drawing.setTranslate, clipDx, clipDy) .call(Drawing.setScale, xScaleFactor2, yScaleFactor2); - var scatterPoints = subplot.plot.selectAll('.scatterlayer .points, .boxlayer .points'); + var traceGroups = subplot.plot + .selectAll('.scatterlayer .trace, .boxlayer .trace, .violinlayer .trace'); subplot.plot .call(Drawing.setTranslate, plotDx, plotDy) .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: - scatterPoints.selectAll('.point') - .call(Drawing.setPointGroupScale, xScaleFactor2, yScaleFactor2) - .call(Drawing.hideOutsideRangePoints, subplot); - - scatterPoints.selectAll('.textpoint') - .call(Drawing.setTextPointsScale, xScaleFactor2, yScaleFactor2) + // This is specifically directed at marker points in scatter, box and violin traces, + // applying an inverse scale to individual points to counteract + // the scale of the trace as a whole: + traceGroups.selectAll('.point') + .call(Drawing.setPointGroupScale, xScaleFactor2, yScaleFactor2); + traceGroups.selectAll('.textpoint') + .call(Drawing.setTextPointsScale, xScaleFactor2, yScaleFactor2); + traceGroups .call(Drawing.hideOutsideRangePoints, subplot); } } diff --git a/src/plots/cartesian/set_convert.js b/src/plots/cartesian/set_convert.js index c72492a4d0e..08691f1879b 100644 --- a/src/plots/cartesian/set_convert.js +++ b/src/plots/cartesian/set_convert.js @@ -435,17 +435,14 @@ module.exports = function setConvert(ax, fullLayout) { ); }; - if(axLetter === 'x') { - ax.isPtWithinRange = function(d) { - var x = d.x; - return x >= ax.range[0] && x <= ax.range[1]; - }; - } else { - ax.isPtWithinRange = function(d) { - var y = d.y; - return y >= ax.range[0] && y <= ax.range[1]; - }; - } + ax.isPtWithinRange = function(d, calendar) { + var coord = ax.c2l(d[axLetter], null, calendar); + + return ( + coord >= ax.r2l(ax.range[0]) && + coord <= ax.r2l(ax.range[1]) + ); + }; // for autoranging: arrays of objects: // {val: axis value, pad: pixel padding} diff --git a/src/plots/cartesian/transition_axes.js b/src/plots/cartesian/transition_axes.js index 181ce35cb19..d0935937a41 100644 --- a/src/plots/cartesian/transition_axes.js +++ b/src/plots/cartesian/transition_axes.js @@ -161,17 +161,16 @@ module.exports = function transitionAxes(gd, newLayout, transitionOpts, makeOnCo .call(Drawing.setTranslate, xa2._offset, ya2._offset) .call(Drawing.setScale, 1, 1); - var scatterPoints = subplot.plot.select('.scatterlayer').selectAll('.points'); + var traceGroups = subplot.plot.selectAll('.scatterlayer .trace'); // This is specifically directed at scatter traces, applying an inverse // scale to individual points to counteract the scale of the trace // as a whole: - scatterPoints.selectAll('.point') - .call(Drawing.setPointGroupScale, 1, 1) - .call(Drawing.hideOutsideRangePoints, subplot); - - scatterPoints.selectAll('.textpoint') - .call(Drawing.setTextPointsScale, 1, 1) + traceGroups.selectAll('.point') + .call(Drawing.setPointGroupScale, 1, 1); + traceGroups.selectAll('.textpoint') + .call(Drawing.setTextPointsScale, 1, 1); + traceGroups .call(Drawing.hideOutsideRangePoints, subplot); } diff --git a/src/plots/ternary/ternary.js b/src/plots/ternary/ternary.js index a42f8461f53..6549fe03fa2 100644 --- a/src/plots/ternary/ternary.js +++ b/src/plots/ternary/ternary.js @@ -652,13 +652,8 @@ proto.initInteractions = function() { _this.plotContainer.selectAll('.crisp').classed('crisp', false); if(_this._hasClipOnAxisFalse) { - var scatterPoints = _this.plotContainer - .select('.scatterlayer').selectAll('.points'); - - scatterPoints.selectAll('.point') - .call(Drawing.hideOutsideRangePoints, _this); - - scatterPoints.selectAll('.textpoint') + _this.plotContainer + .select('.scatterlayer').selectAll('.trace') .call(Drawing.hideOutsideRangePoints, _this); } } diff --git a/src/traces/scatter/plot.js b/src/traces/scatter/plot.js index 7c34555aeb0..b09e8171c39 100644 --- a/src/traces/scatter/plot.js +++ b/src/traces/scatter/plot.js @@ -445,7 +445,7 @@ function plotOne(gd, idx, plotinfo, cdscatter, cdscatterAll, element, transition Drawing.singlePointStyle(d, sel, trace, markerScale, lineScale, gd); if(plotinfo.layerClipId) { - Drawing.hideOutsideRangePoint(d, sel, xa, ya); + Drawing.hideOutsideRangePoint(d, sel, xa, ya, trace.xcalendar, trace.ycalendar); } if(trace.customdata) { @@ -481,7 +481,7 @@ function plotOne(gd, idx, plotinfo, cdscatter, cdscatterAll, element, transition if(hasNode) { if(plotinfo.layerClipId) { - Drawing.hideOutsideRangePoint(d, g, xa, ya); + Drawing.hideOutsideRangePoint(d, g, xa, ya, trace.xcalendar, trace.ycalendar); } } else { g.remove(); diff --git a/test/image/baselines/cliponaxis_false-dates-log.png b/test/image/baselines/cliponaxis_false-dates-log.png new file mode 100644 index 00000000000..12979eb1763 Binary files /dev/null and b/test/image/baselines/cliponaxis_false-dates-log.png differ diff --git a/test/image/baselines/cliponaxis_false.png b/test/image/baselines/cliponaxis_false.png index 59d72538191..3e3303d357f 100644 Binary files a/test/image/baselines/cliponaxis_false.png and b/test/image/baselines/cliponaxis_false.png differ diff --git a/test/image/mocks/cliponaxis_false-dates-log.json b/test/image/mocks/cliponaxis_false-dates-log.json new file mode 100644 index 00000000000..90d93051580 --- /dev/null +++ b/test/image/mocks/cliponaxis_false-dates-log.json @@ -0,0 +1,58 @@ +{ + "data": [{ + "name": "gregorian input dates", + "x": ["2017-11-1", "2017-11-2", "2017-11-3", "2017-11-4", "2017-11-5", "2017-11-6", "2017-11-7"], + "y": [4734, 7793, 7784, 6628, 5644, 6224, 5058], + "text": [4734, 7793, 7784, 6628, 5644, 6224, 5058], + "mode": "lines+markers+text", + "marker": {"size": 30}, + "textposition": "top right", + "hoverinfo": "x+y", + "cliponaxis": false + }, { + "name": "julian input dates", + "y": ["2017-11-1", "2017-11-2", "2017-11-3", "2017-11-4", "2017-11-5", "2017-11-6", "2017-11-7"], + "x": [4734, 7793, 7784, 6628, 5644, 6224, 5058], + "text": [4734, 7793, 7784, 6628, 5644, 6224, 5058], + "mode": "lines+markers+text", + "marker": {"size": 30}, + "textposition": "bottom left", + "hoverinfo": "x+y", + "cliponaxis": false, + "ycalendar": "julian", + "xaxis": "x2", + "yaxis": "y2" + }], + "layout": { + "dragmode": "pan", + "width": 700, + "height": 400, + "xaxis": { + "domain": [0, 0.48], + "title": "gregorian date axis", + "range": ["2017-11-1", "2017-11-7"] + }, + "yaxis": { + "type": "log" , + "title": "log axis" + }, + "xaxis2": { + "type": "log", + "domain": [0.52, 1], + "title": "log axis", + "anchor": "y2" + }, + "yaxis2": { + "anchor": "x2", + "side": "right", + "title": "gregorian date axis", + "range": ["2017-11-14", "2017-11-20"] + }, + "legend": { + "x": 0, + "y": 1.1, + "xanchor": "left", + "yanchor": "bottom" + } + } +} diff --git a/test/image/mocks/cliponaxis_false.json b/test/image/mocks/cliponaxis_false.json index 22b38fd91c0..f4f4aa80a21 100644 --- a/test/image/mocks/cliponaxis_false.json +++ b/test/image/mocks/cliponaxis_false.json @@ -35,7 +35,7 @@ }, { "mode": "markers", - "x": [1, 1, 2, 3, 3, 2], + "x": ["a", "a", "b", "c", "c", "b"], "y": [2, 1, 1, 1, 2, 2], "marker": { "size": [15, 20, 40, 25, 50, 40], @@ -75,7 +75,7 @@ }, "xaxis2": { "anchor": "y2", - "range": [1, 3], + "range": [0, 2], "domain": [0.52, 1], "showline": true, "linewidth": 2,