Fix rangebreaks overlapping and tick positions

src/plots/cartesian/axes.js

@@ -56,6 +56,15 @@ var autorange = require('./autorange');
 axes.getAutoRange = autorange.getAutoRange;
 axes.findExtremes = autorange.findExtremes;
 
+var epsilon = 0.0001;
+function expandRange(range) {
+ var delta = (range[1] - range[0]) * epsilon;
+ return [
+ range[0] - delta,
+ range[1] + delta
+ ];
+}
+
 /*
  * find the list of possible axes to reference with an xref or yref attribute
  * and coerce it to that list
@@ -566,8 +575,9 @@ axes.calcTicks = function calcTicks(ax) {
  ax._tmin = axes.tickFirst(ax);
 
  // add a tiny bit so we get ticks which may have rounded out
- var startTick = rng[0] * 1.0001 - rng[1] * 0.0001;
- var endTick = rng[1] * 1.0001 - rng[0] * 0.0001;
+ var exRng = expandRange(rng);
+ var startTick = exRng[0];
+ var endTick = exRng[1];
  // check for reversed axis
  var axrev = (rng[1] < rng[0]);
 
@@ -612,39 +622,42 @@ axes.calcTicks = function calcTicks(ax) {
 
  if(ax.rangebreaks) {
  // replace ticks inside breaks that would get a tick
- if(ax.tickmode === 'auto') {
- for(var t = 0; t < tickVals.length; t++) {
- var value = tickVals[t].value;
- if(ax.maskBreaks(value) === BADNUM) {
- // find which break we are in
- for(var k = 0; k < ax._rangebreaks.length; k++) {
- var brk = ax._rangebreaks[k];
- if(value >= brk.min && value < brk.max) {
- tickVals[t].value = brk.max; // replace with break end
- break;
- }
- }
- }
- }
- }
-
- // reduce ticks
+ // and reduce ticks
  var len = tickVals.length;
- if(len > 2) {
- var tf2 = 2 * (ax.tickfont ? ax.tickfont.size : 12);
+ if(len) {
+ var tf = 0;
+ if(ax.tickmode === 'auto') {
+ tf =
+ (ax._id.charAt(0) === 'y' ? 2 : 6) *
+ (ax.tickfont ? ax.tickfont.size : 12);
+ }
 
  var newTickVals = [];
  var prevPos;
 
  var dir = axrev ? 1 : -1;
  var first = axrev ? 0 : len - 1;
  var last = axrev ? len - 1 : 0;
- for(var q = first; dir * q <= dir * last; q += dir) { // apply reverse loop to pick greater values in breaks first
- var pos = ax.c2p(tickVals[q].value);
+ for(var q = first; dir * q <= dir * last; q += dir) {
+ var tickVal = tickVals[q];
+ if(ax.maskBreaks(tickVal.value) === BADNUM) {
+ tickVal.value = moveOutsideBreak(tickVal.value, ax);
+
+ if(ax._rl && (
+ ax._rl[0] === tickVal.value ||
+ ax._rl[1] === tickVal.value
+ )) continue;
+ }
 
- if(prevPos === undefined || Math.abs(pos - prevPos) > tf2) {
+ var pos = ax.c2p(tickVal.value);
+
+ if(pos === prevPos) {
+ if(newTickVals[newTickVals.length - 1].value < tickVal.value) {
+ newTickVals[newTickVals.length - 1] = tickVal;
+ }
+ } else if(prevPos === undefined || Math.abs(pos - prevPos) > tf) {
  prevPos = pos;
- newTickVals.push(tickVals[q]);
+ newTickVals.push(tickVal);
  }
  }
  tickVals = newTickVals.reverse();
@@ -691,10 +704,9 @@ function arrayTicks(ax) {
  var text = ax.ticktext;
  var ticksOut = new Array(vals.length);
  var rng = Lib.simpleMap(ax.range, ax.r2l);
- var r0expanded = rng[0] * 1.0001 - rng[1] * 0.0001;
- var r1expanded = rng[1] * 1.0001 - rng[0] * 0.0001;
- var tickMin = Math.min(r0expanded, r1expanded);
- var tickMax = Math.max(r0expanded, r1expanded);
+ var exRng = expandRange(rng);
+ var tickMin = Math.min(exRng[0], exRng[1]);
+ var tickMax = Math.max(exRng[0], exRng[1]);
  var j = 0;
 
  // without a text array, just format the given values as any other ticks
@@ -785,8 +797,7 @@ axes.autoTicks = function(ax, roughDTick) {
  roughDTick /= ONEAVGMONTH;
  ax.dtick = 'M' + roundDTick(roughDTick, 1, roundBase24);
  } else if(roughX2 > ONEDAY) {
- ax.dtick = roundDTick(roughDTick, ONEDAY, ax._hasDayOfWeekBreaks ? [1, 7, 14] : roundDays);
-
+ ax.dtick = roundDTick(roughDTick, ONEDAY, ax._hasDayOfWeekBreaks ? [1, 2, 7, 14] : roundDays);
  // get week ticks on sunday
  // this will also move the base tick off 2000-01-01 if dtick is
  // 2 or 3 days... but that's a weird enough case that we'll ignore it.
@@ -934,18 +945,20 @@ axes.tickIncrement = function(x, dtick, axrev, calendar) {
  if(tType === 'M') return Lib.incrementMonth(x, dtSigned, calendar);
 
  // Log scales: Linear, Digits
-else if(tType === 'L') return Math.log(Math.pow(10, x) + dtSigned) / Math.LN10;
+ if(tType === 'L') return Math.log(Math.pow(10, x) + dtSigned) / Math.LN10;
 
  // log10 of 2,5,10, or all digits (logs just have to be
  // close enough to round)
-else if(tType === 'D') {
+ if(tType === 'D') {
  var tickset = (dtick === 'D2') ? roundLog2 : roundLog1;
  var x2 = x + axSign * 0.01;
  var frac = Lib.roundUp(Lib.mod(x2, 1), tickset, axrev);
 
  return Math.floor(x2) +
  Math.log(d3.round(Math.pow(10, frac), 1)) / Math.LN10;
- } else throw 'unrecognized dtick ' + String(dtick);
+ }
+
+ throw 'unrecognized dtick ' + String(dtick);
 };
 
 // calculate the first tick on an axis
@@ -956,7 +969,7 @@ axes.tickFirst = function(ax) {
  var sRound = axrev ? Math.floor : Math.ceil;
  // add a tiny extra bit to make sure we get ticks
  // that may have been rounded out
- var r0 = rng[0] * 1.0001 - rng[1] * 0.0001;
+ var r0 = expandRange(rng)[0];
  var dtick = ax.dtick;
  var tick0 = r2l(ax.tick0);
 
@@ -3158,3 +3171,14 @@ function swapAxisAttrs(layout, key, xFullAxes, yFullAxes, dfltTitle) {
 function isAngular(ax) {
  return ax._id === 'angularaxis';
 }
+
+function moveOutsideBreak(v, ax) {
+ var len = ax._rangebreaks.length;
+ for(var k = 0; k < len; k++) {
+ var brk = ax._rangebreaks[k];
+ if(v >= brk.min && v < brk.max) {
+ return brk.max;
+ }
+ }
+ return v;
+}

src/plots/cartesian/set_convert.js

@@ -686,9 +686,7 @@ module.exports = function setConvert(ax, fullLayout) {
  var isNewBreak = true;
  for(var j = 0; j < rangebreaksOut.length; j++) {
  var brkj = rangebreaksOut[j];
- if(min > brkj.max || max < brkj.min) {
- // potentially a new break
- } else {
+ if(min < brkj.max && max >= brkj.min) {
  if(min < brkj.min) {
  brkj.min = min;
  }

test/image/mocks/axes_breaks-dtick_auto.json

@@ -0,0 +1,115 @@
+{
+ "data": [
+ {
+ "type": "scatter",
+ "mode": "markers",
+ "x": [
+ "2020-04-06T09:00:00",
+ "2020-04-06T10:00:00",
+ "2020-04-06T11:00:00",
+ "2020-04-06T12:00:00",
+ "2020-04-06T13:00:00",
+ "2020-04-06T14:00:00",
+ "2020-04-06T15:00:00",
+ "2020-04-06T16:00:00",
+ "2020-04-07T09:00:00",
+ "2020-04-07T10:00:00",
+ "2020-04-07T11:00:00",
+ "2020-04-07T12:00:00",
+ "2020-04-07T13:00:00",
+ "2020-04-07T14:00:00",
+ "2020-04-07T15:00:00",
+ "2020-04-07T16:00:00",
+ "2020-04-08T09:00:00",
+ "2020-04-08T10:00:00",
+ "2020-04-08T11:00:00",
+ "2020-04-08T12:00:00",
+ "2020-04-08T13:00:00",
+ "2020-04-08T14:00:00",
+ "2020-04-08T15:00:00",
+ "2020-04-08T16:00:00",
+ "2020-04-09T09:00:00",
+ "2020-04-09T10:00:00",
+ "2020-04-09T11:00:00",
+ "2020-04-09T12:00:00",
+ "2020-04-09T13:00:00",
+ "2020-04-09T14:00:00",
+ "2020-04-09T15:00:00",
+ "2020-04-09T16:00:00",
+ "2020-04-10T09:00:00",
+ "2020-04-10T10:00:00",
+ "2020-04-10T11:00:00",
+ "2020-04-10T12:00:00",
+ "2020-04-10T13:00:00",
+ "2020-04-10T14:00:00",
+ "2020-04-10T15:00:00",
+ "2020-04-10T16:00:00"
+ ],
+ "y": [
+ 0.19742877314456364,
+ 0.1509714558226325,
+ 0.3730270552929804,
+ 0.7394093812216096,
+ 1.2149308862244954,
+ 1.5707342286171064,
+ 1.0824483128021085,
+ 0.9424263772804724,
+ 1.1724169397045303,
+ 0.8440466169659708,
+ 0.8650832231701001,
+ 0.41942121150935374,
+ 0.11941773640575382,
+ -0.3620604691336322,
+ -0.06836276577621159,
+ -0.34443807771583146,
+ -0.49908639701892876,
+ -0.07100510355333789,
+ 0.13340929837019488,
+ -0.33475177209849727,
+ -0.6700576156005845,
+ -0.548579214100821,
+ -0.4713506254966534,
+ -0.7334578041221448,
+ -0.299243806197351,
+ -0.18527785023145504,
+ -0.14964504720649674,
+ -0.05973507085192575,
+ 0.17038695866484388,
+ -0.01766804585555426,
+ -0.11944698363946238,
+ -0.40960323466434023,
+ -0.7234102287840041,
+ -0.2790378388000705,
+ -0.039487043750782935,
+ -0.04902823513321586,
+ -0.3216136071598926,
+ -0.5672571253894997,
+ -1.009227965065624,
+ -1.0748113395075032
+ ]
+ }
+ ],
+ "layout": {
+ "width": 800,
+ "height": 600,
+ "xaxis": {
+ "rangebreaks": [
+ {
+ "bounds": [
+ 17,
+ 9
+ ],
+ "pattern": "hour"
+ }
+ ],
+ "title": {
+ "text": "time"
+ }
+ },
+ "yaxis": {
+ "title": {
+ "text": "values"
+ }
+ }
+ }
+}

src/plots/cartesian/axes.js

@@ -56,6 +56,15 @@ var autorange = require('./autorange');
 axes.getAutoRange = autorange.getAutoRange;
 axes.findExtremes = autorange.findExtremes;
 
+var epsilon = 0.0001;
+function expandRange(range) {
+ var delta = (range[1] - range[0]) * epsilon;
+ return [
+ range[0] - delta,
+ range[1] + delta
+ ];
+}
+
 /*
  * find the list of possible axes to reference with an xref or yref attribute
  * and coerce it to that list
@@ -566,8 +575,9 @@ axes.calcTicks = function calcTicks(ax) {
  ax._tmin = axes.tickFirst(ax);
 
  // add a tiny bit so we get ticks which may have rounded out
- var startTick = rng[0] * 1.0001 - rng[1] * 0.0001;
- var endTick = rng[1] * 1.0001 - rng[0] * 0.0001;
+ var exRng = expandRange(rng);
+ var startTick = exRng[0];
+ var endTick = exRng[1];
  // check for reversed axis
  var axrev = (rng[1] < rng[0]);
 
@@ -612,39 +622,42 @@ axes.calcTicks = function calcTicks(ax) {
 
  if(ax.rangebreaks) {
  // replace ticks inside breaks that would get a tick
- if(ax.tickmode === 'auto') {
- for(var t = 0; t < tickVals.length; t++) {
- var value = tickVals[t].value;
- if(ax.maskBreaks(value) === BADNUM) {
- // find which break we are in
- for(var k = 0; k < ax._rangebreaks.length; k++) {
- var brk = ax._rangebreaks[k];
- if(value >= brk.min && value < brk.max) {
- tickVals[t].value = brk.max; // replace with break end
- break;
- }
- }
- }
- }
- }
-
- // reduce ticks
+ // and reduce ticks
  var len = tickVals.length;
- if(len > 2) {
- var tf2 = 2 * (ax.tickfont ? ax.tickfont.size : 12);
+ if(len) {
+ var tf = 0;
+ if(ax.tickmode === 'auto') {
+ tf =
+ (ax._id.charAt(0) === 'y' ? 2 : 6) *
+ (ax.tickfont ? ax.tickfont.size : 12);
+ }
 
  var newTickVals = [];
  var prevPos;
 
  var dir = axrev ? 1 : -1;
  var first = axrev ? 0 : len - 1;
  var last = axrev ? len - 1 : 0;
- for(var q = first; dir * q <= dir * last; q += dir) { // apply reverse loop to pick greater values in breaks first
- var pos = ax.c2p(tickVals[q].value);
+ for(var q = first; dir * q <= dir * last; q += dir) {
+ var tickVal = tickVals[q];
+ if(ax.maskBreaks(tickVal.value) === BADNUM) {
+ tickVal.value = moveOutsideBreak(tickVal.value, ax);
+
+ if(ax._rl && (
+ ax._rl[0] === tickVal.value ||
+ ax._rl[1] === tickVal.value
+ )) continue;
+ }
 
- if(prevPos === undefined || Math.abs(pos - prevPos) > tf2) {
+ var pos = ax.c2p(tickVal.value);
+
+ if(pos === prevPos) {
+ if(newTickVals[newTickVals.length - 1].value < tickVal.value) {
+ newTickVals[newTickVals.length - 1] = tickVal;
+ }
+ } else if(prevPos === undefined || Math.abs(pos - prevPos) > tf) {
  prevPos = pos;
- newTickVals.push(tickVals[q]);
+ newTickVals.push(tickVal);
  }
  }
  tickVals = newTickVals.reverse();
@@ -691,10 +704,9 @@ function arrayTicks(ax) {
  var text = ax.ticktext;
  var ticksOut = new Array(vals.length);
  var rng = Lib.simpleMap(ax.range, ax.r2l);
- var r0expanded = rng[0] * 1.0001 - rng[1] * 0.0001;
- var r1expanded = rng[1] * 1.0001 - rng[0] * 0.0001;
- var tickMin = Math.min(r0expanded, r1expanded);
- var tickMax = Math.max(r0expanded, r1expanded);
+ var exRng = expandRange(rng);
+ var tickMin = Math.min(exRng[0], exRng[1]);
+ var tickMax = Math.max(exRng[0], exRng[1]);
  var j = 0;
 
  // without a text array, just format the given values as any other ticks
@@ -785,8 +797,7 @@ axes.autoTicks = function(ax, roughDTick) {
  roughDTick /= ONEAVGMONTH;
  ax.dtick = 'M' + roundDTick(roughDTick, 1, roundBase24);
  } else if(roughX2 > ONEDAY) {
- ax.dtick = roundDTick(roughDTick, ONEDAY, ax._hasDayOfWeekBreaks ? [1, 7, 14] : roundDays);
-
+ ax.dtick = roundDTick(roughDTick, ONEDAY, ax._hasDayOfWeekBreaks ? [1, 2, 7, 14] : roundDays);
  // get week ticks on sunday
  // this will also move the base tick off 2000-01-01 if dtick is
  // 2 or 3 days... but that's a weird enough case that we'll ignore it.
@@ -934,18 +945,20 @@ axes.tickIncrement = function(x, dtick, axrev, calendar) {
  if(tType === 'M') return Lib.incrementMonth(x, dtSigned, calendar);
 
  // Log scales: Linear, Digits
-else if(tType === 'L') return Math.log(Math.pow(10, x) + dtSigned) / Math.LN10;
+ if(tType === 'L') return Math.log(Math.pow(10, x) + dtSigned) / Math.LN10;
 
  // log10 of 2,5,10, or all digits (logs just have to be
  // close enough to round)
-else if(tType === 'D') {
+ if(tType === 'D') {
  var tickset = (dtick === 'D2') ? roundLog2 : roundLog1;
  var x2 = x + axSign * 0.01;
  var frac = Lib.roundUp(Lib.mod(x2, 1), tickset, axrev);
 
  return Math.floor(x2) +
  Math.log(d3.round(Math.pow(10, frac), 1)) / Math.LN10;
- } else throw 'unrecognized dtick ' + String(dtick);
+ }
+
+ throw 'unrecognized dtick ' + String(dtick);
 };
 
 // calculate the first tick on an axis
@@ -956,7 +969,7 @@ axes.tickFirst = function(ax) {
  var sRound = axrev ? Math.floor : Math.ceil;
  // add a tiny extra bit to make sure we get ticks
  // that may have been rounded out
- var r0 = rng[0] * 1.0001 - rng[1] * 0.0001;
+ var r0 = expandRange(rng)[0];
  var dtick = ax.dtick;
  var tick0 = r2l(ax.tick0);
 
@@ -3158,3 +3171,14 @@ function swapAxisAttrs(layout, key, xFullAxes, yFullAxes, dfltTitle) {
 function isAngular(ax) {
  return ax._id === 'angularaxis';
 }
+
+function moveOutsideBreak(v, ax) {
+ var len = ax._rangebreaks.length;
+ for(var k = 0; k < len; k++) {
+ var brk = ax._rangebreaks[k];
+ if(v >= brk.min && v < brk.max) {
+ return brk.max;
+ }
+ }
+ return v;
+}

src/plots/cartesian/set_convert.js

@@ -686,9 +686,7 @@ module.exports = function setConvert(ax, fullLayout) {
  var isNewBreak = true;
  for(var j = 0; j < rangebreaksOut.length; j++) {
  var brkj = rangebreaksOut[j];
- if(min > brkj.max || max < brkj.min) {
- // potentially a new break
- } else {
+ if(min < brkj.max && max >= brkj.min) {
  if(min < brkj.min) {
  brkj.min = min;
  }

test/image/mocks/axes_breaks-dtick_auto.json

@@ -0,0 +1,115 @@
+{
+ "data": [
+ {
+ "type": "scatter",
+ "mode": "markers",
+ "x": [
+ "2020-04-06T09:00:00",
+ "2020-04-06T10:00:00",
+ "2020-04-06T11:00:00",
+ "2020-04-06T12:00:00",
+ "2020-04-06T13:00:00",
+ "2020-04-06T14:00:00",
+ "2020-04-06T15:00:00",
+ "2020-04-06T16:00:00",
+ "2020-04-07T09:00:00",
+ "2020-04-07T10:00:00",
+ "2020-04-07T11:00:00",
+ "2020-04-07T12:00:00",
+ "2020-04-07T13:00:00",
+ "2020-04-07T14:00:00",
+ "2020-04-07T15:00:00",
+ "2020-04-07T16:00:00",
+ "2020-04-08T09:00:00",
+ "2020-04-08T10:00:00",
+ "2020-04-08T11:00:00",
+ "2020-04-08T12:00:00",
+ "2020-04-08T13:00:00",
+ "2020-04-08T14:00:00",
+ "2020-04-08T15:00:00",
+ "2020-04-08T16:00:00",
+ "2020-04-09T09:00:00",
+ "2020-04-09T10:00:00",
+ "2020-04-09T11:00:00",
+ "2020-04-09T12:00:00",
+ "2020-04-09T13:00:00",
+ "2020-04-09T14:00:00",
+ "2020-04-09T15:00:00",
+ "2020-04-09T16:00:00",
+ "2020-04-10T09:00:00",
+ "2020-04-10T10:00:00",
+ "2020-04-10T11:00:00",
+ "2020-04-10T12:00:00",
+ "2020-04-10T13:00:00",
+ "2020-04-10T14:00:00",
+ "2020-04-10T15:00:00",
+ "2020-04-10T16:00:00"
+ ],
+ "y": [
+ 0.19742877314456364,
+ 0.1509714558226325,
+ 0.3730270552929804,
+ 0.7394093812216096,
+ 1.2149308862244954,
+ 1.5707342286171064,
+ 1.0824483128021085,
+ 0.9424263772804724,
+ 1.1724169397045303,
+ 0.8440466169659708,
+ 0.8650832231701001,
+ 0.41942121150935374,
+ 0.11941773640575382,
+ -0.3620604691336322,
+ -0.06836276577621159,
+ -0.34443807771583146,
+ -0.49908639701892876,
+ -0.07100510355333789,
+ 0.13340929837019488,
+ -0.33475177209849727,
+ -0.6700576156005845,
+ -0.548579214100821,
+ -0.4713506254966534,
+ -0.7334578041221448,
+ -0.299243806197351,
+ -0.18527785023145504,
+ -0.14964504720649674,
+ -0.05973507085192575,
+ 0.17038695866484388,
+ -0.01766804585555426,
+ -0.11944698363946238,
+ -0.40960323466434023,
+ -0.7234102287840041,
+ -0.2790378388000705,
+ -0.039487043750782935,
+ -0.04902823513321586,
+ -0.3216136071598926,
+ -0.5672571253894997,
+ -1.009227965065624,
+ -1.0748113395075032
+ ]
+ }
+ ],
+ "layout": {
+ "width": 800,
+ "height": 600,
+ "xaxis": {
+ "rangebreaks": [
+ {
+ "bounds": [
+ 17,
+ 9
+ ],
+ "pattern": "hour"
+ }
+ ],
+ "title": {
+ "text": "time"
+ }
+ },
+ "yaxis": {
+ "title": {
+ "text": "values"
+ }
+ }
+ }
+}

src/plots/cartesian/axes.js

@@ -56,6 +56,15 @@ var autorange = require('./autorange');
 axes.getAutoRange = autorange.getAutoRange;
 axes.findExtremes = autorange.findExtremes;
 
+var epsilon = 0.0001;
+function expandRange(range) {
+ var delta = (range[1] - range[0]) * epsilon;
+ return [
+ range[0] - delta,
+ range[1] + delta
+ ];
+}
+
 /*
  * find the list of possible axes to reference with an xref or yref attribute
  * and coerce it to that list
@@ -566,8 +575,9 @@ axes.calcTicks = function calcTicks(ax) {
  ax._tmin = axes.tickFirst(ax);
 
  // add a tiny bit so we get ticks which may have rounded out
- var startTick = rng[0] * 1.0001 - rng[1] * 0.0001;
- var endTick = rng[1] * 1.0001 - rng[0] * 0.0001;
+ var exRng = expandRange(rng);
+ var startTick = exRng[0];
+ var endTick = exRng[1];
  // check for reversed axis
  var axrev = (rng[1] < rng[0]);
 
@@ -612,39 +622,42 @@ axes.calcTicks = function calcTicks(ax) {
 
  if(ax.rangebreaks) {
  // replace ticks inside breaks that would get a tick
- if(ax.tickmode === 'auto') {
- for(var t = 0; t < tickVals.length; t++) {
- var value = tickVals[t].value;
- if(ax.maskBreaks(value) === BADNUM) {
- // find which break we are in
- for(var k = 0; k < ax._rangebreaks.length; k++) {
- var brk = ax._rangebreaks[k];
- if(value >= brk.min && value < brk.max) {
- tickVals[t].value = brk.max; // replace with break end
- break;
- }
- }
- }
- }
- }
-
- // reduce ticks
+ // and reduce ticks
  var len = tickVals.length;
- if(len > 2) {
- var tf2 = 2 * (ax.tickfont ? ax.tickfont.size : 12);
+ if(len) {
+ var tf = 0;
+ if(ax.tickmode === 'auto') {
+ tf =
+ (ax._id.charAt(0) === 'y' ? 2 : 6) *
+ (ax.tickfont ? ax.tickfont.size : 12);
+ }
 
  var newTickVals = [];
  var prevPos;
 
  var dir = axrev ? 1 : -1;
  var first = axrev ? 0 : len - 1;
  var last = axrev ? len - 1 : 0;
- for(var q = first; dir * q <= dir * last; q += dir) { // apply reverse loop to pick greater values in breaks first
- var pos = ax.c2p(tickVals[q].value);
+ for(var q = first; dir * q <= dir * last; q += dir) {
+ var tickVal = tickVals[q];
+ if(ax.maskBreaks(tickVal.value) === BADNUM) {
+ tickVal.value = moveOutsideBreak(tickVal.value, ax);
+
+ if(ax._rl && (
+ ax._rl[0] === tickVal.value ||
+ ax._rl[1] === tickVal.value
+ )) continue;
+ }
 
- if(prevPos === undefined || Math.abs(pos - prevPos) > tf2) {
+ var pos = ax.c2p(tickVal.value);
+
+ if(pos === prevPos) {
+ if(newTickVals[newTickVals.length - 1].value < tickVal.value) {
+ newTickVals[newTickVals.length - 1] = tickVal;
+ }
+ } else if(prevPos === undefined || Math.abs(pos - prevPos) > tf) {
  prevPos = pos;
- newTickVals.push(tickVals[q]);
+ newTickVals.push(tickVal);
  }
  }
  tickVals = newTickVals.reverse();
@@ -691,10 +704,9 @@ function arrayTicks(ax) {
  var text = ax.ticktext;
  var ticksOut = new Array(vals.length);
  var rng = Lib.simpleMap(ax.range, ax.r2l);
- var r0expanded = rng[0] * 1.0001 - rng[1] * 0.0001;
- var r1expanded = rng[1] * 1.0001 - rng[0] * 0.0001;
- var tickMin = Math.min(r0expanded, r1expanded);
- var tickMax = Math.max(r0expanded, r1expanded);
+ var exRng = expandRange(rng);
+ var tickMin = Math.min(exRng[0], exRng[1]);
+ var tickMax = Math.max(exRng[0], exRng[1]);
  var j = 0;
 
  // without a text array, just format the given values as any other ticks
@@ -785,8 +797,7 @@ axes.autoTicks = function(ax, roughDTick) {
  roughDTick /= ONEAVGMONTH;
  ax.dtick = 'M' + roundDTick(roughDTick, 1, roundBase24);
  } else if(roughX2 > ONEDAY) {
- ax.dtick = roundDTick(roughDTick, ONEDAY, ax._hasDayOfWeekBreaks ? [1, 7, 14] : roundDays);
-
+ ax.dtick = roundDTick(roughDTick, ONEDAY, ax._hasDayOfWeekBreaks ? [1, 2, 7, 14] : roundDays);
  // get week ticks on sunday
  // this will also move the base tick off 2000-01-01 if dtick is
  // 2 or 3 days... but that's a weird enough case that we'll ignore it.
@@ -934,18 +945,20 @@ axes.tickIncrement = function(x, dtick, axrev, calendar) {
  if(tType === 'M') return Lib.incrementMonth(x, dtSigned, calendar);
 
  // Log scales: Linear, Digits
-else if(tType === 'L') return Math.log(Math.pow(10, x) + dtSigned) / Math.LN10;
+ if(tType === 'L') return Math.log(Math.pow(10, x) + dtSigned) / Math.LN10;
 
  // log10 of 2,5,10, or all digits (logs just have to be
  // close enough to round)
-else if(tType === 'D') {
+ if(tType === 'D') {
  var tickset = (dtick === 'D2') ? roundLog2 : roundLog1;
  var x2 = x + axSign * 0.01;
  var frac = Lib.roundUp(Lib.mod(x2, 1), tickset, axrev);
 
  return Math.floor(x2) +
  Math.log(d3.round(Math.pow(10, frac), 1)) / Math.LN10;
- } else throw 'unrecognized dtick ' + String(dtick);
+ }
+
+ throw 'unrecognized dtick ' + String(dtick);
 };
 
 // calculate the first tick on an axis
@@ -956,7 +969,7 @@ axes.tickFirst = function(ax) {
  var sRound = axrev ? Math.floor : Math.ceil;
  // add a tiny extra bit to make sure we get ticks
  // that may have been rounded out
- var r0 = rng[0] * 1.0001 - rng[1] * 0.0001;
+ var r0 = expandRange(rng)[0];
  var dtick = ax.dtick;
  var tick0 = r2l(ax.tick0);
 
@@ -3158,3 +3171,14 @@ function swapAxisAttrs(layout, key, xFullAxes, yFullAxes, dfltTitle) {
 function isAngular(ax) {
  return ax._id === 'angularaxis';
 }
+
+function moveOutsideBreak(v, ax) {
+ var len = ax._rangebreaks.length;
+ for(var k = 0; k < len; k++) {
+ var brk = ax._rangebreaks[k];
+ if(v >= brk.min && v < brk.max) {
+ return brk.max;
+ }
+ }
+ return v;
+}

src/plots/cartesian/set_convert.js

@@ -686,9 +686,7 @@ module.exports = function setConvert(ax, fullLayout) {
  var isNewBreak = true;
  for(var j = 0; j < rangebreaksOut.length; j++) {
  var brkj = rangebreaksOut[j];
- if(min > brkj.max || max < brkj.min) {
- // potentially a new break
- } else {
+ if(min < brkj.max && max >= brkj.min) {
  if(min < brkj.min) {
  brkj.min = min;
  }

test/image/mocks/axes_breaks-dtick_auto.json

@@ -0,0 +1,115 @@
+{
+ "data": [
+ {
+ "type": "scatter",
+ "mode": "markers",
+ "x": [
+ "2020-04-06T09:00:00",
+ "2020-04-06T10:00:00",
+ "2020-04-06T11:00:00",
+ "2020-04-06T12:00:00",
+ "2020-04-06T13:00:00",
+ "2020-04-06T14:00:00",
+ "2020-04-06T15:00:00",
+ "2020-04-06T16:00:00",
+ "2020-04-07T09:00:00",
+ "2020-04-07T10:00:00",
+ "2020-04-07T11:00:00",
+ "2020-04-07T12:00:00",
+ "2020-04-07T13:00:00",
+ "2020-04-07T14:00:00",
+ "2020-04-07T15:00:00",
+ "2020-04-07T16:00:00",
+ "2020-04-08T09:00:00",
+ "2020-04-08T10:00:00",
+ "2020-04-08T11:00:00",
+ "2020-04-08T12:00:00",
+ "2020-04-08T13:00:00",
+ "2020-04-08T14:00:00",
+ "2020-04-08T15:00:00",
+ "2020-04-08T16:00:00",
+ "2020-04-09T09:00:00",
+ "2020-04-09T10:00:00",
+ "2020-04-09T11:00:00",
+ "2020-04-09T12:00:00",
+ "2020-04-09T13:00:00",
+ "2020-04-09T14:00:00",
+ "2020-04-09T15:00:00",
+ "2020-04-09T16:00:00",
+ "2020-04-10T09:00:00",
+ "2020-04-10T10:00:00",
+ "2020-04-10T11:00:00",
+ "2020-04-10T12:00:00",
+ "2020-04-10T13:00:00",
+ "2020-04-10T14:00:00",
+ "2020-04-10T15:00:00",
+ "2020-04-10T16:00:00"
+ ],
+ "y": [
+ 0.19742877314456364,
+ 0.1509714558226325,
+ 0.3730270552929804,
+ 0.7394093812216096,
+ 1.2149308862244954,
+ 1.5707342286171064,
+ 1.0824483128021085,
+ 0.9424263772804724,
+ 1.1724169397045303,
+ 0.8440466169659708,
+ 0.8650832231701001,
+ 0.41942121150935374,
+ 0.11941773640575382,
+ -0.3620604691336322,
+ -0.06836276577621159,
+ -0.34443807771583146,
+ -0.49908639701892876,
+ -0.07100510355333789,
+ 0.13340929837019488,
+ -0.33475177209849727,
+ -0.6700576156005845,
+ -0.548579214100821,
+ -0.4713506254966534,
+ -0.7334578041221448,
+ -0.299243806197351,
+ -0.18527785023145504,
+ -0.14964504720649674,
+ -0.05973507085192575,
+ 0.17038695866484388,
+ -0.01766804585555426,
+ -0.11944698363946238,
+ -0.40960323466434023,
+ -0.7234102287840041,
+ -0.2790378388000705,
+ -0.039487043750782935,
+ -0.04902823513321586,
+ -0.3216136071598926,
+ -0.5672571253894997,
+ -1.009227965065624,
+ -1.0748113395075032
+ ]
+ }
+ ],
+ "layout": {
+ "width": 800,
+ "height": 600,
+ "xaxis": {
+ "rangebreaks": [
+ {
+ "bounds": [
+ 17,
+ 9
+ ],
+ "pattern": "hour"
+ }
+ ],
+ "title": {
+ "text": "time"
+ }
+ },
+ "yaxis": {
+ "title": {
+ "text": "values"
+ }
+ }
+ }
+}

src/plots/cartesian/axes.js

@@ -56,6 +56,15 @@ var autorange = require('./autorange');
 axes.getAutoRange = autorange.getAutoRange;
 axes.findExtremes = autorange.findExtremes;
 
+var epsilon = 0.0001;
+function expandRange(range) {
+ var delta = (range[1] - range[0]) * epsilon;
+ return [
+ range[0] - delta,
+ range[1] + delta
+ ];
+}
+
 /*
  * find the list of possible axes to reference with an xref or yref attribute
  * and coerce it to that list
@@ -566,8 +575,9 @@ axes.calcTicks = function calcTicks(ax) {
  ax._tmin = axes.tickFirst(ax);
 
  // add a tiny bit so we get ticks which may have rounded out
- var startTick = rng[0] * 1.0001 - rng[1] * 0.0001;
- var endTick = rng[1] * 1.0001 - rng[0] * 0.0001;
+ var exRng = expandRange(rng);
+ var startTick = exRng[0];
+ var endTick = exRng[1];
  // check for reversed axis
  var axrev = (rng[1] < rng[0]);
 
@@ -612,39 +622,42 @@ axes.calcTicks = function calcTicks(ax) {
 
  if(ax.rangebreaks) {
  // replace ticks inside breaks that would get a tick
- if(ax.tickmode === 'auto') {
- for(var t = 0; t < tickVals.length; t++) {
- var value = tickVals[t].value;
- if(ax.maskBreaks(value) === BADNUM) {
- // find which break we are in
- for(var k = 0; k < ax._rangebreaks.length; k++) {
- var brk = ax._rangebreaks[k];
- if(value >= brk.min && value < brk.max) {
- tickVals[t].value = brk.max; // replace with break end
- break;
- }
- }
- }
- }
- }
-
- // reduce ticks
+ // and reduce ticks
  var len = tickVals.length;
- if(len > 2) {
- var tf2 = 2 * (ax.tickfont ? ax.tickfont.size : 12);
+ if(len) {
+ var tf = 0;
+ if(ax.tickmode === 'auto') {
+ tf =
+ (ax._id.charAt(0) === 'y' ? 2 : 6) *
+ (ax.tickfont ? ax.tickfont.size : 12);
+ }
 
  var newTickVals = [];
  var prevPos;
 
  var dir = axrev ? 1 : -1;
  var first = axrev ? 0 : len - 1;
  var last = axrev ? len - 1 : 0;
- for(var q = first; dir * q <= dir * last; q += dir) { // apply reverse loop to pick greater values in breaks first
- var pos = ax.c2p(tickVals[q].value);
+ for(var q = first; dir * q <= dir * last; q += dir) {
+ var tickVal = tickVals[q];
+ if(ax.maskBreaks(tickVal.value) === BADNUM) {
+ tickVal.value = moveOutsideBreak(tickVal.value, ax);
+
+ if(ax._rl && (
+ ax._rl[0] === tickVal.value ||
+ ax._rl[1] === tickVal.value
+ )) continue;
+ }
 
- if(prevPos === undefined || Math.abs(pos - prevPos) > tf2) {
+ var pos = ax.c2p(tickVal.value);
+
+ if(pos === prevPos) {
+ if(newTickVals[newTickVals.length - 1].value < tickVal.value) {
+ newTickVals[newTickVals.length - 1] = tickVal;
+ }
+ } else if(prevPos === undefined || Math.abs(pos - prevPos) > tf) {
  prevPos = pos;
- newTickVals.push(tickVals[q]);
+ newTickVals.push(tickVal);
  }
  }
  tickVals = newTickVals.reverse();
@@ -691,10 +704,9 @@ function arrayTicks(ax) {
  var text = ax.ticktext;
  var ticksOut = new Array(vals.length);
  var rng = Lib.simpleMap(ax.range, ax.r2l);
- var r0expanded = rng[0] * 1.0001 - rng[1] * 0.0001;
- var r1expanded = rng[1] * 1.0001 - rng[0] * 0.0001;
- var tickMin = Math.min(r0expanded, r1expanded);
- var tickMax = Math.max(r0expanded, r1expanded);
+ var exRng = expandRange(rng);
+ var tickMin = Math.min(exRng[0], exRng[1]);
+ var tickMax = Math.max(exRng[0], exRng[1]);
  var j = 0;
 
  // without a text array, just format the given values as any other ticks
@@ -785,8 +797,7 @@ axes.autoTicks = function(ax, roughDTick) {
  roughDTick /= ONEAVGMONTH;
  ax.dtick = 'M' + roundDTick(roughDTick, 1, roundBase24);
  } else if(roughX2 > ONEDAY) {
- ax.dtick = roundDTick(roughDTick, ONEDAY, ax._hasDayOfWeekBreaks ? [1, 7, 14] : roundDays);
-
+ ax.dtick = roundDTick(roughDTick, ONEDAY, ax._hasDayOfWeekBreaks ? [1, 2, 7, 14] : roundDays);
  // get week ticks on sunday
  // this will also move the base tick off 2000-01-01 if dtick is
  // 2 or 3 days... but that's a weird enough case that we'll ignore it.
@@ -934,18 +945,20 @@ axes.tickIncrement = function(x, dtick, axrev, calendar) {
  if(tType === 'M') return Lib.incrementMonth(x, dtSigned, calendar);
 
  // Log scales: Linear, Digits
-else if(tType === 'L') return Math.log(Math.pow(10, x) + dtSigned) / Math.LN10;
+ if(tType === 'L') return Math.log(Math.pow(10, x) + dtSigned) / Math.LN10;
 
  // log10 of 2,5,10, or all digits (logs just have to be
  // close enough to round)
-else if(tType === 'D') {
+ if(tType === 'D') {
  var tickset = (dtick === 'D2') ? roundLog2 : roundLog1;
  var x2 = x + axSign * 0.01;
  var frac = Lib.roundUp(Lib.mod(x2, 1), tickset, axrev);
 
  return Math.floor(x2) +
  Math.log(d3.round(Math.pow(10, frac), 1)) / Math.LN10;
- } else throw 'unrecognized dtick ' + String(dtick);
+ }
+
+ throw 'unrecognized dtick ' + String(dtick);
 };
 
 // calculate the first tick on an axis
@@ -956,7 +969,7 @@ axes.tickFirst = function(ax) {
  var sRound = axrev ? Math.floor : Math.ceil;
  // add a tiny extra bit to make sure we get ticks
  // that may have been rounded out
- var r0 = rng[0] * 1.0001 - rng[1] * 0.0001;
+ var r0 = expandRange(rng)[0];
  var dtick = ax.dtick;
  var tick0 = r2l(ax.tick0);
 
@@ -3158,3 +3171,14 @@ function swapAxisAttrs(layout, key, xFullAxes, yFullAxes, dfltTitle) {
 function isAngular(ax) {
  return ax._id === 'angularaxis';
 }
+
+function moveOutsideBreak(v, ax) {
+ var len = ax._rangebreaks.length;
+ for(var k = 0; k < len; k++) {
+ var brk = ax._rangebreaks[k];
+ if(v >= brk.min && v < brk.max) {
+ return brk.max;
+ }
+ }
+ return v;
+}

src/plots/cartesian/set_convert.js

@@ -686,9 +686,7 @@ module.exports = function setConvert(ax, fullLayout) {
  var isNewBreak = true;
  for(var j = 0; j < rangebreaksOut.length; j++) {
  var brkj = rangebreaksOut[j];
- if(min > brkj.max || max < brkj.min) {
- // potentially a new break
- } else {
+ if(min < brkj.max && max >= brkj.min) {
  if(min < brkj.min) {
  brkj.min = min;
  }

test/image/mocks/axes_breaks-dtick_auto.json

@@ -0,0 +1,115 @@
+{
+ "data": [
+ {
+ "type": "scatter",
+ "mode": "markers",
+ "x": [
+ "2020-04-06T09:00:00",
+ "2020-04-06T10:00:00",
+ "2020-04-06T11:00:00",
+ "2020-04-06T12:00:00",
+ "2020-04-06T13:00:00",
+ "2020-04-06T14:00:00",
+ "2020-04-06T15:00:00",
+ "2020-04-06T16:00:00",
+ "2020-04-07T09:00:00",
+ "2020-04-07T10:00:00",
+ "2020-04-07T11:00:00",
+ "2020-04-07T12:00:00",
+ "2020-04-07T13:00:00",
+ "2020-04-07T14:00:00",
+ "2020-04-07T15:00:00",
+ "2020-04-07T16:00:00",
+ "2020-04-08T09:00:00",
+ "2020-04-08T10:00:00",
+ "2020-04-08T11:00:00",
+ "2020-04-08T12:00:00",
+ "2020-04-08T13:00:00",
+ "2020-04-08T14:00:00",
+ "2020-04-08T15:00:00",
+ "2020-04-08T16:00:00",
+ "2020-04-09T09:00:00",
+ "2020-04-09T10:00:00",
+ "2020-04-09T11:00:00",
+ "2020-04-09T12:00:00",
+ "2020-04-09T13:00:00",
+ "2020-04-09T14:00:00",
+ "2020-04-09T15:00:00",
+ "2020-04-09T16:00:00",
+ "2020-04-10T09:00:00",
+ "2020-04-10T10:00:00",
+ "2020-04-10T11:00:00",
+ "2020-04-10T12:00:00",
+ "2020-04-10T13:00:00",
+ "2020-04-10T14:00:00",
+ "2020-04-10T15:00:00",
+ "2020-04-10T16:00:00"
+ ],
+ "y": [
+ 0.19742877314456364,
+ 0.1509714558226325,
+ 0.3730270552929804,
+ 0.7394093812216096,
+ 1.2149308862244954,
+ 1.5707342286171064,
+ 1.0824483128021085,
+ 0.9424263772804724,
+ 1.1724169397045303,
+ 0.8440466169659708,
+ 0.8650832231701001,
+ 0.41942121150935374,
+ 0.11941773640575382,
+ -0.3620604691336322,
+ -0.06836276577621159,
+ -0.34443807771583146,
+ -0.49908639701892876,
+ -0.07100510355333789,
+ 0.13340929837019488,
+ -0.33475177209849727,
+ -0.6700576156005845,
+ -0.548579214100821,
+ -0.4713506254966534,
+ -0.7334578041221448,
+ -0.299243806197351,
+ -0.18527785023145504,
+ -0.14964504720649674,
+ -0.05973507085192575,
+ 0.17038695866484388,
+ -0.01766804585555426,
+ -0.11944698363946238,
+ -0.40960323466434023,
+ -0.7234102287840041,
+ -0.2790378388000705,
+ -0.039487043750782935,
+ -0.04902823513321586,
+ -0.3216136071598926,
+ -0.5672571253894997,
+ -1.009227965065624,
+ -1.0748113395075032
+ ]
+ }
+ ],
+ "layout": {
+ "width": 800,
+ "height": 600,
+ "xaxis": {
+ "rangebreaks": [
+ {
+ "bounds": [
+ 17,
+ 9
+ ],
+ "pattern": "hour"
+ }
+ ],
+ "title": {
+ "text": "time"
+ }
+ },
+ "yaxis": {
+ "title": {
+ "text": "values"
+ }
+ }
+ }
+}

src/plots/cartesian/axes.js

@@ -56,6 +56,15 @@ var autorange = require('./autorange');
 axes.getAutoRange = autorange.getAutoRange;
 axes.findExtremes = autorange.findExtremes;
 
+var epsilon = 0.0001;
+function expandRange(range) {
+ var delta = (range[1] - range[0]) * epsilon;
+ return [
+ range[0] - delta,
+ range[1] + delta
+ ];
+}
+
 /*
  * find the list of possible axes to reference with an xref or yref attribute
  * and coerce it to that list
@@ -566,8 +575,9 @@ axes.calcTicks = function calcTicks(ax) {
  ax._tmin = axes.tickFirst(ax);
 
  // add a tiny bit so we get ticks which may have rounded out
- var startTick = rng[0] * 1.0001 - rng[1] * 0.0001;
- var endTick = rng[1] * 1.0001 - rng[0] * 0.0001;
+ var exRng = expandRange(rng);
+ var startTick = exRng[0];
+ var endTick = exRng[1];
  // check for reversed axis
  var axrev = (rng[1] < rng[0]);
 
@@ -612,39 +622,42 @@ axes.calcTicks = function calcTicks(ax) {
 
  if(ax.rangebreaks) {
  // replace ticks inside breaks that would get a tick
- if(ax.tickmode === 'auto') {
- for(var t = 0; t < tickVals.length; t++) {
- var value = tickVals[t].value;
- if(ax.maskBreaks(value) === BADNUM) {
- // find which break we are in
- for(var k = 0; k < ax._rangebreaks.length; k++) {
- var brk = ax._rangebreaks[k];
- if(value >= brk.min && value < brk.max) {
- tickVals[t].value = brk.max; // replace with break end
- break;
- }
- }
- }
- }
- }
-
- // reduce ticks
+ // and reduce ticks
  var len = tickVals.length;
- if(len > 2) {
- var tf2 = 2 * (ax.tickfont ? ax.tickfont.size : 12);
+ if(len) {
+ var tf = 0;
+ if(ax.tickmode === 'auto') {
+ tf =
+ (ax._id.charAt(0) === 'y' ? 2 : 6) *
+ (ax.tickfont ? ax.tickfont.size : 12);
+ }
 
  var newTickVals = [];
  var prevPos;
 
  var dir = axrev ? 1 : -1;
  var first = axrev ? 0 : len - 1;
  var last = axrev ? len - 1 : 0;
- for(var q = first; dir * q <= dir * last; q += dir) { // apply reverse loop to pick greater values in breaks first
- var pos = ax.c2p(tickVals[q].value);
+ for(var q = first; dir * q <= dir * last; q += dir) {
+ var tickVal = tickVals[q];
+ if(ax.maskBreaks(tickVal.value) === BADNUM) {
+ tickVal.value = moveOutsideBreak(tickVal.value, ax);
+
+ if(ax._rl && (
+ ax._rl[0] === tickVal.value ||
+ ax._rl[1] === tickVal.value
+ )) continue;
+ }
 
- if(prevPos === undefined || Math.abs(pos - prevPos) > tf2) {
+ var pos = ax.c2p(tickVal.value);
+
+ if(pos === prevPos) {
+ if(newTickVals[newTickVals.length - 1].value < tickVal.value) {
+ newTickVals[newTickVals.length - 1] = tickVal;
+ }
+ } else if(prevPos === undefined || Math.abs(pos - prevPos) > tf) {
  prevPos = pos;
- newTickVals.push(tickVals[q]);
+ newTickVals.push(tickVal);
  }
  }
  tickVals = newTickVals.reverse();
@@ -691,10 +704,9 @@ function arrayTicks(ax) {
  var text = ax.ticktext;
  var ticksOut = new Array(vals.length);
  var rng = Lib.simpleMap(ax.range, ax.r2l);
- var r0expanded = rng[0] * 1.0001 - rng[1] * 0.0001;
- var r1expanded = rng[1] * 1.0001 - rng[0] * 0.0001;
- var tickMin = Math.min(r0expanded, r1expanded);
- var tickMax = Math.max(r0expanded, r1expanded);
+ var exRng = expandRange(rng);
+ var tickMin = Math.min(exRng[0], exRng[1]);
+ var tickMax = Math.max(exRng[0], exRng[1]);
  var j = 0;
 
  // without a text array, just format the given values as any other ticks
@@ -785,8 +797,7 @@ axes.autoTicks = function(ax, roughDTick) {
  roughDTick /= ONEAVGMONTH;
  ax.dtick = 'M' + roundDTick(roughDTick, 1, roundBase24);
  } else if(roughX2 > ONEDAY) {
- ax.dtick = roundDTick(roughDTick, ONEDAY, ax._hasDayOfWeekBreaks ? [1, 7, 14] : roundDays);
-
+ ax.dtick = roundDTick(roughDTick, ONEDAY, ax._hasDayOfWeekBreaks ? [1, 2, 7, 14] : roundDays);
  // get week ticks on sunday
  // this will also move the base tick off 2000-01-01 if dtick is
  // 2 or 3 days... but that's a weird enough case that we'll ignore it.
@@ -934,18 +945,20 @@ axes.tickIncrement = function(x, dtick, axrev, calendar) {
  if(tType === 'M') return Lib.incrementMonth(x, dtSigned, calendar);
 
  // Log scales: Linear, Digits
-else if(tType === 'L') return Math.log(Math.pow(10, x) + dtSigned) / Math.LN10;
+ if(tType === 'L') return Math.log(Math.pow(10, x) + dtSigned) / Math.LN10;
 
  // log10 of 2,5,10, or all digits (logs just have to be
  // close enough to round)
-else if(tType === 'D') {
+ if(tType === 'D') {
  var tickset = (dtick === 'D2') ? roundLog2 : roundLog1;
  var x2 = x + axSign * 0.01;
  var frac = Lib.roundUp(Lib.mod(x2, 1), tickset, axrev);
 
  return Math.floor(x2) +
  Math.log(d3.round(Math.pow(10, frac), 1)) / Math.LN10;
- } else throw 'unrecognized dtick ' + String(dtick);
+ }
+
+ throw 'unrecognized dtick ' + String(dtick);
 };
 
 // calculate the first tick on an axis
@@ -956,7 +969,7 @@ axes.tickFirst = function(ax) {
  var sRound = axrev ? Math.floor : Math.ceil;
  // add a tiny extra bit to make sure we get ticks
  // that may have been rounded out
- var r0 = rng[0] * 1.0001 - rng[1] * 0.0001;
+ var r0 = expandRange(rng)[0];
  var dtick = ax.dtick;
  var tick0 = r2l(ax.tick0);
 
@@ -3158,3 +3171,14 @@ function swapAxisAttrs(layout, key, xFullAxes, yFullAxes, dfltTitle) {
 function isAngular(ax) {
  return ax._id === 'angularaxis';
 }
+
+function moveOutsideBreak(v, ax) {
+ var len = ax._rangebreaks.length;
+ for(var k = 0; k < len; k++) {
+ var brk = ax._rangebreaks[k];
+ if(v >= brk.min && v < brk.max) {
+ return brk.max;
+ }
+ }
+ return v;
+}

src/plots/cartesian/set_convert.js

@@ -686,9 +686,7 @@ module.exports = function setConvert(ax, fullLayout) {
  var isNewBreak = true;
  for(var j = 0; j < rangebreaksOut.length; j++) {
  var brkj = rangebreaksOut[j];
- if(min > brkj.max || max < brkj.min) {
- // potentially a new break
- } else {
+ if(min < brkj.max && max >= brkj.min) {
  if(min < brkj.min) {
  brkj.min = min;
  }

test/image/mocks/axes_breaks-dtick_auto.json

@@ -0,0 +1,115 @@
+{
+ "data": [
+ {
+ "type": "scatter",
+ "mode": "markers",
+ "x": [
+ "2020-04-06T09:00:00",
+ "2020-04-06T10:00:00",
+ "2020-04-06T11:00:00",
+ "2020-04-06T12:00:00",
+ "2020-04-06T13:00:00",
+ "2020-04-06T14:00:00",
+ "2020-04-06T15:00:00",
+ "2020-04-06T16:00:00",
+ "2020-04-07T09:00:00",
+ "2020-04-07T10:00:00",
+ "2020-04-07T11:00:00",
+ "2020-04-07T12:00:00",
+ "2020-04-07T13:00:00",
+ "2020-04-07T14:00:00",
+ "2020-04-07T15:00:00",
+ "2020-04-07T16:00:00",
+ "2020-04-08T09:00:00",
+ "2020-04-08T10:00:00",
+ "2020-04-08T11:00:00",
+ "2020-04-08T12:00:00",
+ "2020-04-08T13:00:00",
+ "2020-04-08T14:00:00",
+ "2020-04-08T15:00:00",
+ "2020-04-08T16:00:00",
+ "2020-04-09T09:00:00",
+ "2020-04-09T10:00:00",
+ "2020-04-09T11:00:00",
+ "2020-04-09T12:00:00",
+ "2020-04-09T13:00:00",
+ "2020-04-09T14:00:00",
+ "2020-04-09T15:00:00",
+ "2020-04-09T16:00:00",
+ "2020-04-10T09:00:00",
+ "2020-04-10T10:00:00",
+ "2020-04-10T11:00:00",
+ "2020-04-10T12:00:00",
+ "2020-04-10T13:00:00",
+ "2020-04-10T14:00:00",
+ "2020-04-10T15:00:00",
+ "2020-04-10T16:00:00"
+ ],
+ "y": [
+ 0.19742877314456364,
+ 0.1509714558226325,
+ 0.3730270552929804,
+ 0.7394093812216096,
+ 1.2149308862244954,
+ 1.5707342286171064,
+ 1.0824483128021085,
+ 0.9424263772804724,
+ 1.1724169397045303,
+ 0.8440466169659708,
+ 0.8650832231701001,
+ 0.41942121150935374,
+ 0.11941773640575382,
+ -0.3620604691336322,
+ -0.06836276577621159,
+ -0.34443807771583146,
+ -0.49908639701892876,
+ -0.07100510355333789,
+ 0.13340929837019488,
+ -0.33475177209849727,
+ -0.6700576156005845,
+ -0.548579214100821,
+ -0.4713506254966534,
+ -0.7334578041221448,
+ -0.299243806197351,
+ -0.18527785023145504,
+ -0.14964504720649674,
+ -0.05973507085192575,
+ 0.17038695866484388,
+ -0.01766804585555426,
+ -0.11944698363946238,
+ -0.40960323466434023,
+ -0.7234102287840041,
+ -0.2790378388000705,
+ -0.039487043750782935,
+ -0.04902823513321586,
+ -0.3216136071598926,
+ -0.5672571253894997,
+ -1.009227965065624,
+ -1.0748113395075032
+ ]
+ }
+ ],
+ "layout": {
+ "width": 800,
+ "height": 600,
+ "xaxis": {
+ "rangebreaks": [
+ {
+ "bounds": [
+ 17,
+ 9
+ ],
+ "pattern": "hour"
+ }
+ ],
+ "title": {
+ "text": "time"
+ }
+ },
+ "yaxis": {
+ "title": {
+ "text": "values"
+ }
+ }
+ }
+}

src/plots/cartesian/axes.js

@@ -56,6 +56,15 @@ var autorange = require('./autorange');
 axes.getAutoRange = autorange.getAutoRange;
 axes.findExtremes = autorange.findExtremes;
 
+var epsilon = 0.0001;
+function expandRange(range) {
+ var delta = (range[1] - range[0]) * epsilon;
+ return [
+ range[0] - delta,
+ range[1] + delta
+ ];
+}
+
 /*
  * find the list of possible axes to reference with an xref or yref attribute
  * and coerce it to that list
@@ -566,8 +575,9 @@ axes.calcTicks = function calcTicks(ax) {
  ax._tmin = axes.tickFirst(ax);
 
  // add a tiny bit so we get ticks which may have rounded out
- var startTick = rng[0] * 1.0001 - rng[1] * 0.0001;
- var endTick = rng[1] * 1.0001 - rng[0] * 0.0001;
+ var exRng = expandRange(rng);
+ var startTick = exRng[0];
+ var endTick = exRng[1];
  // check for reversed axis
  var axrev = (rng[1] < rng[0]);
 
@@ -612,39 +622,42 @@ axes.calcTicks = function calcTicks(ax) {
 
  if(ax.rangebreaks) {
  // replace ticks inside breaks that would get a tick
- if(ax.tickmode === 'auto') {
- for(var t = 0; t < tickVals.length; t++) {
- var value = tickVals[t].value;
- if(ax.maskBreaks(value) === BADNUM) {
- // find which break we are in
- for(var k = 0; k < ax._rangebreaks.length; k++) {
- var brk = ax._rangebreaks[k];
- if(value >= brk.min && value < brk.max) {
- tickVals[t].value = brk.max; // replace with break end
- break;
- }
- }
- }
- }
- }
-
- // reduce ticks
+ // and reduce ticks
  var len = tickVals.length;
- if(len > 2) {
- var tf2 = 2 * (ax.tickfont ? ax.tickfont.size : 12);
+ if(len) {
+ var tf = 0;
+ if(ax.tickmode === 'auto') {
+ tf =
+ (ax._id.charAt(0) === 'y' ? 2 : 6) *
+ (ax.tickfont ? ax.tickfont.size : 12);
+ }
 
  var newTickVals = [];
  var prevPos;
 
  var dir = axrev ? 1 : -1;
  var first = axrev ? 0 : len - 1;
  var last = axrev ? len - 1 : 0;
- for(var q = first; dir * q <= dir * last; q += dir) { // apply reverse loop to pick greater values in breaks first
- var pos = ax.c2p(tickVals[q].value);
+ for(var q = first; dir * q <= dir * last; q += dir) {
+ var tickVal = tickVals[q];
+ if(ax.maskBreaks(tickVal.value) === BADNUM) {
+ tickVal.value = moveOutsideBreak(tickVal.value, ax);
+
+ if(ax._rl && (
+ ax._rl[0] === tickVal.value ||
+ ax._rl[1] === tickVal.value
+ )) continue;
+ }
 
- if(prevPos === undefined || Math.abs(pos - prevPos) > tf2) {
+ var pos = ax.c2p(tickVal.value);
+
+ if(pos === prevPos) {
+ if(newTickVals[newTickVals.length - 1].value < tickVal.value) {
+ newTickVals[newTickVals.length - 1] = tickVal;
+ }
+ } else if(prevPos === undefined || Math.abs(pos - prevPos) > tf) {
  prevPos = pos;
- newTickVals.push(tickVals[q]);
+ newTickVals.push(tickVal);
  }
  }
  tickVals = newTickVals.reverse();
@@ -691,10 +704,9 @@ function arrayTicks(ax) {
  var text = ax.ticktext;
  var ticksOut = new Array(vals.length);
  var rng = Lib.simpleMap(ax.range, ax.r2l);
- var r0expanded = rng[0] * 1.0001 - rng[1] * 0.0001;
- var r1expanded = rng[1] * 1.0001 - rng[0] * 0.0001;
- var tickMin = Math.min(r0expanded, r1expanded);
- var tickMax = Math.max(r0expanded, r1expanded);
+ var exRng = expandRange(rng);
+ var tickMin = Math.min(exRng[0], exRng[1]);
+ var tickMax = Math.max(exRng[0], exRng[1]);
  var j = 0;
 
  // without a text array, just format the given values as any other ticks
@@ -785,8 +797,7 @@ axes.autoTicks = function(ax, roughDTick) {
  roughDTick /= ONEAVGMONTH;
  ax.dtick = 'M' + roundDTick(roughDTick, 1, roundBase24);
  } else if(roughX2 > ONEDAY) {
- ax.dtick = roundDTick(roughDTick, ONEDAY, ax._hasDayOfWeekBreaks ? [1, 7, 14] : roundDays);
-
+ ax.dtick = roundDTick(roughDTick, ONEDAY, ax._hasDayOfWeekBreaks ? [1, 2, 7, 14] : roundDays);
  // get week ticks on sunday
  // this will also move the base tick off 2000-01-01 if dtick is
  // 2 or 3 days... but that's a weird enough case that we'll ignore it.
@@ -934,18 +945,20 @@ axes.tickIncrement = function(x, dtick, axrev, calendar) {
  if(tType === 'M') return Lib.incrementMonth(x, dtSigned, calendar);
 
  // Log scales: Linear, Digits
-else if(tType === 'L') return Math.log(Math.pow(10, x) + dtSigned) / Math.LN10;
+ if(tType === 'L') return Math.log(Math.pow(10, x) + dtSigned) / Math.LN10;
 
  // log10 of 2,5,10, or all digits (logs just have to be
  // close enough to round)
-else if(tType === 'D') {
+ if(tType === 'D') {
  var tickset = (dtick === 'D2') ? roundLog2 : roundLog1;
  var x2 = x + axSign * 0.01;
  var frac = Lib.roundUp(Lib.mod(x2, 1), tickset, axrev);
 
  return Math.floor(x2) +
  Math.log(d3.round(Math.pow(10, frac), 1)) / Math.LN10;
- } else throw 'unrecognized dtick ' + String(dtick);
+ }
+
+ throw 'unrecognized dtick ' + String(dtick);
 };
 
 // calculate the first tick on an axis
@@ -956,7 +969,7 @@ axes.tickFirst = function(ax) {
  var sRound = axrev ? Math.floor : Math.ceil;
  // add a tiny extra bit to make sure we get ticks
  // that may have been rounded out
- var r0 = rng[0] * 1.0001 - rng[1] * 0.0001;
+ var r0 = expandRange(rng)[0];
  var dtick = ax.dtick;
  var tick0 = r2l(ax.tick0);
 
@@ -3158,3 +3171,14 @@ function swapAxisAttrs(layout, key, xFullAxes, yFullAxes, dfltTitle) {
 function isAngular(ax) {
  return ax._id === 'angularaxis';
 }
+
+function moveOutsideBreak(v, ax) {
+ var len = ax._rangebreaks.length;
+ for(var k = 0; k < len; k++) {
+ var brk = ax._rangebreaks[k];
+ if(v >= brk.min && v < brk.max) {
+ return brk.max;
+ }
+ }
+ return v;
+}

src/plots/cartesian/set_convert.js

@@ -686,9 +686,7 @@ module.exports = function setConvert(ax, fullLayout) {
  var isNewBreak = true;
  for(var j = 0; j < rangebreaksOut.length; j++) {
  var brkj = rangebreaksOut[j];
- if(min > brkj.max || max < brkj.min) {
- // potentially a new break
- } else {
+ if(min < brkj.max && max >= brkj.min) {
  if(min < brkj.min) {
  brkj.min = min;
  }

test/image/mocks/axes_breaks-dtick_auto.json

@@ -0,0 +1,115 @@
+{
+ "data": [
+ {
+ "type": "scatter",
+ "mode": "markers",
+ "x": [
+ "2020-04-06T09:00:00",
+ "2020-04-06T10:00:00",
+ "2020-04-06T11:00:00",
+ "2020-04-06T12:00:00",
+ "2020-04-06T13:00:00",
+ "2020-04-06T14:00:00",
+ "2020-04-06T15:00:00",
+ "2020-04-06T16:00:00",
+ "2020-04-07T09:00:00",
+ "2020-04-07T10:00:00",
+ "2020-04-07T11:00:00",
+ "2020-04-07T12:00:00",
+ "2020-04-07T13:00:00",
+ "2020-04-07T14:00:00",
+ "2020-04-07T15:00:00",
+ "2020-04-07T16:00:00",
+ "2020-04-08T09:00:00",
+ "2020-04-08T10:00:00",
+ "2020-04-08T11:00:00",
+ "2020-04-08T12:00:00",
+ "2020-04-08T13:00:00",
+ "2020-04-08T14:00:00",
+ "2020-04-08T15:00:00",
+ "2020-04-08T16:00:00",
+ "2020-04-09T09:00:00",
+ "2020-04-09T10:00:00",
+ "2020-04-09T11:00:00",
+ "2020-04-09T12:00:00",
+ "2020-04-09T13:00:00",
+ "2020-04-09T14:00:00",
+ "2020-04-09T15:00:00",
+ "2020-04-09T16:00:00",
+ "2020-04-10T09:00:00",
+ "2020-04-10T10:00:00",
+ "2020-04-10T11:00:00",
+ "2020-04-10T12:00:00",
+ "2020-04-10T13:00:00",
+ "2020-04-10T14:00:00",
+ "2020-04-10T15:00:00",
+ "2020-04-10T16:00:00"
+ ],
+ "y": [
+ 0.19742877314456364,
+ 0.1509714558226325,
+ 0.3730270552929804,
+ 0.7394093812216096,
+ 1.2149308862244954,
+ 1.5707342286171064,
+ 1.0824483128021085,
+ 0.9424263772804724,
+ 1.1724169397045303,
+ 0.8440466169659708,
+ 0.8650832231701001,
+ 0.41942121150935374,
+ 0.11941773640575382,
+ -0.3620604691336322,
+ -0.06836276577621159,
+ -0.34443807771583146,
+ -0.49908639701892876,
+ -0.07100510355333789,
+ 0.13340929837019488,
+ -0.33475177209849727,
+ -0.6700576156005845,
+ -0.548579214100821,
+ -0.4713506254966534,
+ -0.7334578041221448,
+ -0.299243806197351,
+ -0.18527785023145504,
+ -0.14964504720649674,
+ -0.05973507085192575,
+ 0.17038695866484388,
+ -0.01766804585555426,
+ -0.11944698363946238,
+ -0.40960323466434023,
+ -0.7234102287840041,
+ -0.2790378388000705,
+ -0.039487043750782935,
+ -0.04902823513321586,
+ -0.3216136071598926,
+ -0.5672571253894997,
+ -1.009227965065624,
+ -1.0748113395075032
+ ]
+ }
+ ],
+ "layout": {
+ "width": 800,
+ "height": 600,
+ "xaxis": {
+ "rangebreaks": [
+ {
+ "bounds": [
+ 17,
+ 9
+ ],
+ "pattern": "hour"
+ }
+ ],
+ "title": {
+ "text": "time"
+ }
+ },
+ "yaxis": {
+ "title": {
+ "text": "values"
+ }
+ }
+ }
+}

src/plots/cartesian/axes.js

@@ -56,6 +56,15 @@ var autorange = require('./autorange');
 axes.getAutoRange = autorange.getAutoRange;
 axes.findExtremes = autorange.findExtremes;
 
+var epsilon = 0.0001;
+function expandRange(range) {
+ var delta = (range[1] - range[0]) * epsilon;
+ return [
+ range[0] - delta,
+ range[1] + delta
+ ];
+}
+
 /*
  * find the list of possible axes to reference with an xref or yref attribute
  * and coerce it to that list
@@ -566,8 +575,9 @@ axes.calcTicks = function calcTicks(ax) {
  ax._tmin = axes.tickFirst(ax);
 
  // add a tiny bit so we get ticks which may have rounded out
- var startTick = rng[0] * 1.0001 - rng[1] * 0.0001;
- var endTick = rng[1] * 1.0001 - rng[0] * 0.0001;
+ var exRng = expandRange(rng);
+ var startTick = exRng[0];
+ var endTick = exRng[1];
  // check for reversed axis
  var axrev = (rng[1] < rng[0]);
 
@@ -612,39 +622,42 @@ axes.calcTicks = function calcTicks(ax) {
 
  if(ax.rangebreaks) {
  // replace ticks inside breaks that would get a tick
- if(ax.tickmode === 'auto') {
- for(var t = 0; t < tickVals.length; t++) {
- var value = tickVals[t].value;
- if(ax.maskBreaks(value) === BADNUM) {
- // find which break we are in
- for(var k = 0; k < ax._rangebreaks.length; k++) {
- var brk = ax._rangebreaks[k];
- if(value >= brk.min && value < brk.max) {
- tickVals[t].value = brk.max; // replace with break end
- break;
- }
- }
- }
- }
- }
-
- // reduce ticks
+ // and reduce ticks
  var len = tickVals.length;
- if(len > 2) {
- var tf2 = 2 * (ax.tickfont ? ax.tickfont.size : 12);
+ if(len) {
+ var tf = 0;
+ if(ax.tickmode === 'auto') {
+ tf =
+ (ax._id.charAt(0) === 'y' ? 2 : 6) *
+ (ax.tickfont ? ax.tickfont.size : 12);
+ }
 
  var newTickVals = [];
  var prevPos;
 
  var dir = axrev ? 1 : -1;
  var first = axrev ? 0 : len - 1;
  var last = axrev ? len - 1 : 0;
- for(var q = first; dir * q <= dir * last; q += dir) { // apply reverse loop to pick greater values in breaks first
- var pos = ax.c2p(tickVals[q].value);
+ for(var q = first; dir * q <= dir * last; q += dir) {
+ var tickVal = tickVals[q];
+ if(ax.maskBreaks(tickVal.value) === BADNUM) {
+ tickVal.value = moveOutsideBreak(tickVal.value, ax);
+
+ if(ax._rl && (
+ ax._rl[0] === tickVal.value ||
+ ax._rl[1] === tickVal.value
+ )) continue;
+ }
 
- if(prevPos === undefined || Math.abs(pos - prevPos) > tf2) {
+ var pos = ax.c2p(tickVal.value);
+
+ if(pos === prevPos) {
+ if(newTickVals[newTickVals.length - 1].value < tickVal.value) {
+ newTickVals[newTickVals.length - 1] = tickVal;
+ }
+ } else if(prevPos === undefined || Math.abs(pos - prevPos) > tf) {
  prevPos = pos;
- newTickVals.push(tickVals[q]);
+ newTickVals.push(tickVal);
  }
  }
  tickVals = newTickVals.reverse();
@@ -691,10 +704,9 @@ function arrayTicks(ax) {
  var text = ax.ticktext;
  var ticksOut = new Array(vals.length);
  var rng = Lib.simpleMap(ax.range, ax.r2l);
- var r0expanded = rng[0] * 1.0001 - rng[1] * 0.0001;
- var r1expanded = rng[1] * 1.0001 - rng[0] * 0.0001;
- var tickMin = Math.min(r0expanded, r1expanded);
- var tickMax = Math.max(r0expanded, r1expanded);
+ var exRng = expandRange(rng);
+ var tickMin = Math.min(exRng[0], exRng[1]);
+ var tickMax = Math.max(exRng[0], exRng[1]);
  var j = 0;
 
  // without a text array, just format the given values as any other ticks
@@ -785,8 +797,7 @@ axes.autoTicks = function(ax, roughDTick) {
  roughDTick /= ONEAVGMONTH;
  ax.dtick = 'M' + roundDTick(roughDTick, 1, roundBase24);
  } else if(roughX2 > ONEDAY) {
- ax.dtick = roundDTick(roughDTick, ONEDAY, ax._hasDayOfWeekBreaks ? [1, 7, 14] : roundDays);
-
+ ax.dtick = roundDTick(roughDTick, ONEDAY, ax._hasDayOfWeekBreaks ? [1, 2, 7, 14] : roundDays);
  // get week ticks on sunday
  // this will also move the base tick off 2000-01-01 if dtick is
  // 2 or 3 days... but that's a weird enough case that we'll ignore it.
@@ -934,18 +945,20 @@ axes.tickIncrement = function(x, dtick, axrev, calendar) {
  if(tType === 'M') return Lib.incrementMonth(x, dtSigned, calendar);
 
  // Log scales: Linear, Digits
-else if(tType === 'L') return Math.log(Math.pow(10, x) + dtSigned) / Math.LN10;
+ if(tType === 'L') return Math.log(Math.pow(10, x) + dtSigned) / Math.LN10;
 
  // log10 of 2,5,10, or all digits (logs just have to be
  // close enough to round)
-else if(tType === 'D') {
+ if(tType === 'D') {
  var tickset = (dtick === 'D2') ? roundLog2 : roundLog1;
  var x2 = x + axSign * 0.01;
  var frac = Lib.roundUp(Lib.mod(x2, 1), tickset, axrev);
 
  return Math.floor(x2) +
  Math.log(d3.round(Math.pow(10, frac), 1)) / Math.LN10;
- } else throw 'unrecognized dtick ' + String(dtick);
+ }
+
+ throw 'unrecognized dtick ' + String(dtick);
 };
 
 // calculate the first tick on an axis
@@ -956,7 +969,7 @@ axes.tickFirst = function(ax) {
  var sRound = axrev ? Math.floor : Math.ceil;
  // add a tiny extra bit to make sure we get ticks
  // that may have been rounded out
- var r0 = rng[0] * 1.0001 - rng[1] * 0.0001;
+ var r0 = expandRange(rng)[0];
  var dtick = ax.dtick;
  var tick0 = r2l(ax.tick0);
 
@@ -3158,3 +3171,14 @@ function swapAxisAttrs(layout, key, xFullAxes, yFullAxes, dfltTitle) {
 function isAngular(ax) {
  return ax._id === 'angularaxis';
 }
+
+function moveOutsideBreak(v, ax) {
+ var len = ax._rangebreaks.length;
+ for(var k = 0; k < len; k++) {
+ var brk = ax._rangebreaks[k];
+ if(v >= brk.min && v < brk.max) {
+ return brk.max;
+ }
+ }
+ return v;
+}

src/plots/cartesian/set_convert.js

@@ -686,9 +686,7 @@ module.exports = function setConvert(ax, fullLayout) {
  var isNewBreak = true;
  for(var j = 0; j < rangebreaksOut.length; j++) {
  var brkj = rangebreaksOut[j];
- if(min > brkj.max || max < brkj.min) {
- // potentially a new break
- } else {
+ if(min < brkj.max && max >= brkj.min) {
  if(min < brkj.min) {
  brkj.min = min;
  }

test/image/mocks/axes_breaks-dtick_auto.json

@@ -0,0 +1,115 @@
+{
+ "data": [
+ {
+ "type": "scatter",
+ "mode": "markers",
+ "x": [
+ "2020-04-06T09:00:00",
+ "2020-04-06T10:00:00",
+ "2020-04-06T11:00:00",
+ "2020-04-06T12:00:00",
+ "2020-04-06T13:00:00",
+ "2020-04-06T14:00:00",
+ "2020-04-06T15:00:00",
+ "2020-04-06T16:00:00",
+ "2020-04-07T09:00:00",
+ "2020-04-07T10:00:00",
+ "2020-04-07T11:00:00",
+ "2020-04-07T12:00:00",
+ "2020-04-07T13:00:00",
+ "2020-04-07T14:00:00",
+ "2020-04-07T15:00:00",
+ "2020-04-07T16:00:00",
+ "2020-04-08T09:00:00",
+ "2020-04-08T10:00:00",
+ "2020-04-08T11:00:00",
+ "2020-04-08T12:00:00",
+ "2020-04-08T13:00:00",
+ "2020-04-08T14:00:00",
+ "2020-04-08T15:00:00",
+ "2020-04-08T16:00:00",
+ "2020-04-09T09:00:00",
+ "2020-04-09T10:00:00",
+ "2020-04-09T11:00:00",
+ "2020-04-09T12:00:00",
+ "2020-04-09T13:00:00",
+ "2020-04-09T14:00:00",
+ "2020-04-09T15:00:00",
+ "2020-04-09T16:00:00",
+ "2020-04-10T09:00:00",
+ "2020-04-10T10:00:00",
+ "2020-04-10T11:00:00",
+ "2020-04-10T12:00:00",
+ "2020-04-10T13:00:00",
+ "2020-04-10T14:00:00",
+ "2020-04-10T15:00:00",
+ "2020-04-10T16:00:00"
+ ],
+ "y": [
+ 0.19742877314456364,
+ 0.1509714558226325,
+ 0.3730270552929804,
+ 0.7394093812216096,
+ 1.2149308862244954,
+ 1.5707342286171064,
+ 1.0824483128021085,
+ 0.9424263772804724,
+ 1.1724169397045303,
+ 0.8440466169659708,
+ 0.8650832231701001,
+ 0.41942121150935374,
+ 0.11941773640575382,
+ -0.3620604691336322,
+ -0.06836276577621159,
+ -0.34443807771583146,
+ -0.49908639701892876,
+ -0.07100510355333789,
+ 0.13340929837019488,
+ -0.33475177209849727,
+ -0.6700576156005845,
+ -0.548579214100821,
+ -0.4713506254966534,
+ -0.7334578041221448,
+ -0.299243806197351,
+ -0.18527785023145504,
+ -0.14964504720649674,
+ -0.05973507085192575,
+ 0.17038695866484388,
+ -0.01766804585555426,
+ -0.11944698363946238,
+ -0.40960323466434023,
+ -0.7234102287840041,
+ -0.2790378388000705,
+ -0.039487043750782935,
+ -0.04902823513321586,
+ -0.3216136071598926,
+ -0.5672571253894997,
+ -1.009227965065624,
+ -1.0748113395075032
+ ]
+ }
+ ],
+ "layout": {
+ "width": 800,
+ "height": 600,
+ "xaxis": {
+ "rangebreaks": [
+ {
+ "bounds": [
+ 17,
+ 9
+ ],
+ "pattern": "hour"
+ }
+ ],
+ "title": {
+ "text": "time"
+ }
+ },
+ "yaxis": {
+ "title": {
+ "text": "values"
+ }
+ }
+ }
+}

src/plots/cartesian/axes.js

@@ -56,6 +56,15 @@ var autorange = require('./autorange');
 axes.getAutoRange = autorange.getAutoRange;
 axes.findExtremes = autorange.findExtremes;
 
+var epsilon = 0.0001;
+function expandRange(range) {
+ var delta = (range[1] - range[0]) * epsilon;
+ return [
+ range[0] - delta,
+ range[1] + delta
+ ];
+}
+
 /*
  * find the list of possible axes to reference with an xref or yref attribute
  * and coerce it to that list
@@ -566,8 +575,9 @@ axes.calcTicks = function calcTicks(ax) {
  ax._tmin = axes.tickFirst(ax);
 
  // add a tiny bit so we get ticks which may have rounded out
- var startTick = rng[0] * 1.0001 - rng[1] * 0.0001;
- var endTick = rng[1] * 1.0001 - rng[0] * 0.0001;
+ var exRng = expandRange(rng);
+ var startTick = exRng[0];
+ var endTick = exRng[1];
  // check for reversed axis
  var axrev = (rng[1] < rng[0]);
 
@@ -612,39 +622,42 @@ axes.calcTicks = function calcTicks(ax) {
 
  if(ax.rangebreaks) {
  // replace ticks inside breaks that would get a tick
- if(ax.tickmode === 'auto') {
- for(var t = 0; t < tickVals.length; t++) {
- var value = tickVals[t].value;
- if(ax.maskBreaks(value) === BADNUM) {
- // find which break we are in
- for(var k = 0; k < ax._rangebreaks.length; k++) {
- var brk = ax._rangebreaks[k];
- if(value >= brk.min && value < brk.max) {
- tickVals[t].value = brk.max; // replace with break end
- break;
- }
- }
- }
- }
- }
-
- // reduce ticks
+ // and reduce ticks
  var len = tickVals.length;
- if(len > 2) {
- var tf2 = 2 * (ax.tickfont ? ax.tickfont.size : 12);
+ if(len) {
+ var tf = 0;
+ if(ax.tickmode === 'auto') {
+ tf =
+ (ax._id.charAt(0) === 'y' ? 2 : 6) *
+ (ax.tickfont ? ax.tickfont.size : 12);
+ }
 
  var newTickVals = [];
  var prevPos;
 
  var dir = axrev ? 1 : -1;
  var first = axrev ? 0 : len - 1;
  var last = axrev ? len - 1 : 0;
- for(var q = first; dir * q <= dir * last; q += dir) { // apply reverse loop to pick greater values in breaks first
- var pos = ax.c2p(tickVals[q].value);
+ for(var q = first; dir * q <= dir * last; q += dir) {
+ var tickVal = tickVals[q];
+ if(ax.maskBreaks(tickVal.value) === BADNUM) {
+ tickVal.value = moveOutsideBreak(tickVal.value, ax);
+
+ if(ax._rl && (
+ ax._rl[0] === tickVal.value ||
+ ax._rl[1] === tickVal.value
+ )) continue;
+ }
 
- if(prevPos === undefined || Math.abs(pos - prevPos) > tf2) {
+ var pos = ax.c2p(tickVal.value);
+
+ if(pos === prevPos) {
+ if(newTickVals[newTickVals.length - 1].value < tickVal.value) {
+ newTickVals[newTickVals.length - 1] = tickVal;
+ }
+ } else if(prevPos === undefined || Math.abs(pos - prevPos) > tf) {
  prevPos = pos;
- newTickVals.push(tickVals[q]);
+ newTickVals.push(tickVal);
  }
  }
  tickVals = newTickVals.reverse();
@@ -691,10 +704,9 @@ function arrayTicks(ax) {
  var text = ax.ticktext;
  var ticksOut = new Array(vals.length);
  var rng = Lib.simpleMap(ax.range, ax.r2l);
- var r0expanded = rng[0] * 1.0001 - rng[1] * 0.0001;
- var r1expanded = rng[1] * 1.0001 - rng[0] * 0.0001;
- var tickMin = Math.min(r0expanded, r1expanded);
- var tickMax = Math.max(r0expanded, r1expanded);
+ var exRng = expandRange(rng);
+ var tickMin = Math.min(exRng[0], exRng[1]);
+ var tickMax = Math.max(exRng[0], exRng[1]);
  var j = 0;
 
  // without a text array, just format the given values as any other ticks
@@ -785,8 +797,7 @@ axes.autoTicks = function(ax, roughDTick) {
  roughDTick /= ONEAVGMONTH;
  ax.dtick = 'M' + roundDTick(roughDTick, 1, roundBase24);
  } else if(roughX2 > ONEDAY) {
- ax.dtick = roundDTick(roughDTick, ONEDAY, ax._hasDayOfWeekBreaks ? [1, 7, 14] : roundDays);
-
+ ax.dtick = roundDTick(roughDTick, ONEDAY, ax._hasDayOfWeekBreaks ? [1, 2, 7, 14] : roundDays);
  // get week ticks on sunday
  // this will also move the base tick off 2000-01-01 if dtick is
  // 2 or 3 days... but that's a weird enough case that we'll ignore it.
@@ -934,18 +945,20 @@ axes.tickIncrement = function(x, dtick, axrev, calendar) {
  if(tType === 'M') return Lib.incrementMonth(x, dtSigned, calendar);
 
  // Log scales: Linear, Digits
-else if(tType === 'L') return Math.log(Math.pow(10, x) + dtSigned) / Math.LN10;
+ if(tType === 'L') return Math.log(Math.pow(10, x) + dtSigned) / Math.LN10;
 
  // log10 of 2,5,10, or all digits (logs just have to be
  // close enough to round)
-else if(tType === 'D') {
+ if(tType === 'D') {
  var tickset = (dtick === 'D2') ? roundLog2 : roundLog1;
  var x2 = x + axSign * 0.01;
  var frac = Lib.roundUp(Lib.mod(x2, 1), tickset, axrev);
 
  return Math.floor(x2) +
  Math.log(d3.round(Math.pow(10, frac), 1)) / Math.LN10;
- } else throw 'unrecognized dtick ' + String(dtick);
+ }
+
+ throw 'unrecognized dtick ' + String(dtick);
 };
 
 // calculate the first tick on an axis
@@ -956,7 +969,7 @@ axes.tickFirst = function(ax) {
  var sRound = axrev ? Math.floor : Math.ceil;
  // add a tiny extra bit to make sure we get ticks
  // that may have been rounded out
- var r0 = rng[0] * 1.0001 - rng[1] * 0.0001;
+ var r0 = expandRange(rng)[0];
  var dtick = ax.dtick;
  var tick0 = r2l(ax.tick0);
 
@@ -3158,3 +3171,14 @@ function swapAxisAttrs(layout, key, xFullAxes, yFullAxes, dfltTitle) {
 function isAngular(ax) {
  return ax._id === 'angularaxis';
 }
+
+function moveOutsideBreak(v, ax) {
+ var len = ax._rangebreaks.length;
+ for(var k = 0; k < len; k++) {
+ var brk = ax._rangebreaks[k];
+ if(v >= brk.min && v < brk.max) {
+ return brk.max;
+ }
+ }
+ return v;
+}

src/plots/cartesian/set_convert.js

@@ -686,9 +686,7 @@ module.exports = function setConvert(ax, fullLayout) {
  var isNewBreak = true;
  for(var j = 0; j < rangebreaksOut.length; j++) {
  var brkj = rangebreaksOut[j];
- if(min > brkj.max || max < brkj.min) {
- // potentially a new break
- } else {
+ if(min < brkj.max && max >= brkj.min) {
  if(min < brkj.min) {
  brkj.min = min;
  }

test/image/mocks/axes_breaks-dtick_auto.json

@@ -0,0 +1,115 @@
+{
+ "data": [
+ {
+ "type": "scatter",
+ "mode": "markers",
+ "x": [
+ "2020-04-06T09:00:00",
+ "2020-04-06T10:00:00",
+ "2020-04-06T11:00:00",
+ "2020-04-06T12:00:00",
+ "2020-04-06T13:00:00",
+ "2020-04-06T14:00:00",
+ "2020-04-06T15:00:00",
+ "2020-04-06T16:00:00",
+ "2020-04-07T09:00:00",
+ "2020-04-07T10:00:00",
+ "2020-04-07T11:00:00",
+ "2020-04-07T12:00:00",
+ "2020-04-07T13:00:00",
+ "2020-04-07T14:00:00",
+ "2020-04-07T15:00:00",
+ "2020-04-07T16:00:00",
+ "2020-04-08T09:00:00",
+ "2020-04-08T10:00:00",
+ "2020-04-08T11:00:00",
+ "2020-04-08T12:00:00",
+ "2020-04-08T13:00:00",
+ "2020-04-08T14:00:00",
+ "2020-04-08T15:00:00",
+ "2020-04-08T16:00:00",
+ "2020-04-09T09:00:00",
+ "2020-04-09T10:00:00",
+ "2020-04-09T11:00:00",
+ "2020-04-09T12:00:00",
+ "2020-04-09T13:00:00",
+ "2020-04-09T14:00:00",
+ "2020-04-09T15:00:00",
+ "2020-04-09T16:00:00",
+ "2020-04-10T09:00:00",
+ "2020-04-10T10:00:00",
+ "2020-04-10T11:00:00",
+ "2020-04-10T12:00:00",
+ "2020-04-10T13:00:00",
+ "2020-04-10T14:00:00",
+ "2020-04-10T15:00:00",
+ "2020-04-10T16:00:00"
+ ],
+ "y": [
+ 0.19742877314456364,
+ 0.1509714558226325,
+ 0.3730270552929804,
+ 0.7394093812216096,
+ 1.2149308862244954,
+ 1.5707342286171064,
+ 1.0824483128021085,
+ 0.9424263772804724,
+ 1.1724169397045303,
+ 0.8440466169659708,
+ 0.8650832231701001,
+ 0.41942121150935374,
+ 0.11941773640575382,
+ -0.3620604691336322,
+ -0.06836276577621159,
+ -0.34443807771583146,
+ -0.49908639701892876,
+ -0.07100510355333789,
+ 0.13340929837019488,
+ -0.33475177209849727,
+ -0.6700576156005845,
+ -0.548579214100821,
+ -0.4713506254966534,
+ -0.7334578041221448,
+ -0.299243806197351,
+ -0.18527785023145504,
+ -0.14964504720649674,
+ -0.05973507085192575,
+ 0.17038695866484388,
+ -0.01766804585555426,
+ -0.11944698363946238,
+ -0.40960323466434023,
+ -0.7234102287840041,
+ -0.2790378388000705,
+ -0.039487043750782935,
+ -0.04902823513321586,
+ -0.3216136071598926,
+ -0.5672571253894997,
+ -1.009227965065624,
+ -1.0748113395075032
+ ]
+ }
+ ],
+ "layout": {
+ "width": 800,
+ "height": 600,
+ "xaxis": {
+ "rangebreaks": [
+ {
+ "bounds": [
+ 17,
+ 9
+ ],
+ "pattern": "hour"
+ }
+ ],
+ "title": {
+ "text": "time"
+ }
+ },
+ "yaxis": {
+ "title": {
+ "text": "values"
+ }
+ }
+ }
+}