Skip to content

Commit bd379f8

Browse files
committed
improve overlap detection for aligned tick labels
1 parent 591b321 commit bd379f8

File tree

7 files changed

+28
-16
lines changed

7 files changed

+28
-16
lines changed

src/plots/cartesian/axes.js

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2534,7 +2534,6 @@ function getTickLabelUV(ax) {
25342534
v += 3; // add extra pad
25352535
}
25362536

2537-
25382537
if(isLeft || isTop) u = -u;
25392538
if(side === 'bottom' || side === 'right') v = -v;
25402539

@@ -3102,11 +3101,24 @@ axes.drawLabels = function(gd, ax, opts) {
31023101
} else {
31033102
var vLen = vals.length;
31043103
var tickSpacing = Math.abs((vals[vLen - 1].x - vals[0].x) * ax._m) / (vLen - 1);
3104+
3105+
var ticklabelposition = ax.ticklabelposition || '';
3106+
var has = function(str) {
3107+
return ticklabelposition.indexOf(str) !== -1;
3108+
};
3109+
var isTop = has('top');
3110+
var isLeft = has('left');
3111+
var isRight = has('right');
3112+
var isBottom = has('bottom');
3113+
var isAligned = isBottom || isLeft || isTop || isRight;
3114+
var pad = !isAligned ? 0 :
3115+
(ax.tickwidth || 0) + 2 * 3; // extra pad
3116+
31053117
var rotate90 = (tickSpacing < maxFontSize * 2.5) || ax.type === 'multicategory';
31063118

31073119
// any overlap at all - set 30 degrees or 90 degrees
31083120
for(i = 0; i < lbbArray.length - 1; i++) {
3109-
if(Lib.bBoxIntersect(lbbArray[i], lbbArray[i + 1])) {
3121+
if(Lib.bBoxIntersect(lbbArray[i], lbbArray[i + 1], pad)) {
31103122
autoangle = rotate90 ? 90 : 30;
31113123
break;
31123124
}
4 Bytes
Loading
-120 Bytes
Loading
167 Bytes
Loading

test/image/mocks/ticklabelposition-0.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@
4343
"ticklabelposition": "outside top",
4444
"tickfont": { "size": 20 },
4545
"ticklen": 8,
46-
"tickwidth": 2,
46+
"tickwidth": 4,
4747
"linewidth": 4,
4848
"gridcolor": "white"
4949
},
@@ -56,7 +56,7 @@
5656
"ticklabelposition": "outside right",
5757
"tickfont": { "size": 20 },
5858
"ticklen": 8,
59-
"tickwidth": 2,
59+
"tickwidth": 4,
6060
"linewidth": 4,
6161
"gridcolor": "white"
6262
},
@@ -95,7 +95,7 @@
9595
"ticklabelposition": "outside bottom",
9696
"tickfont": { "size": 16 },
9797
"ticklen": 8,
98-
"tickwidth": 2,
98+
"tickwidth": 4,
9999
"linewidth": 4,
100100
"gridcolor": "white"
101101
},
@@ -109,7 +109,7 @@
109109
"tickangle": -60,
110110
"tickfont": { "size": 16 },
111111
"ticklen": 8,
112-
"tickwidth": 2,
112+
"tickwidth": 4,
113113
"linewidth": 4,
114114
"gridcolor": "white"
115115
},

test/image/mocks/ticklabelposition-1.json

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,12 @@
22
"data": [{
33
"xaxis": "x",
44
"yaxis": "y",
5-
"x": ["20-12-15", "21-01-15"],
5+
"x": ["20-12-20", "21-01-20"],
66
"y": [1e-1, 1e+6]
77
}, {
88
"xaxis": "x2",
99
"yaxis": "y2",
10-
"x": ["20-10", "21-06"],
10+
"x": ["20-10", "21-05-15"],
1111
"y": [1e-1, 1e+6]
1212
}, {
1313
"xaxis": "x3",
@@ -45,7 +45,7 @@
4545
"ticklabelposition": "inside top",
4646
"tickfont": { "size": 20 },
4747
"ticklen": 8,
48-
"tickwidth": 2,
48+
"tickwidth": 4,
4949
"linewidth": 4,
5050
"gridcolor": "white"
5151
},
@@ -59,7 +59,7 @@
5959
"ticklabelposition": "inside left",
6060
"tickfont": { "size": 20 },
6161
"ticklen": 8,
62-
"tickwidth": 2,
62+
"tickwidth": 4,
6363
"linewidth": 4,
6464
"gridcolor": "white"
6565
},
@@ -99,7 +99,7 @@
9999
"ticklabelposition": "inside bottom",
100100
"tickfont": { "size": 16 },
101101
"ticklen": 8,
102-
"tickwidth": 2,
102+
"tickwidth": 4,
103103
"linewidth": 4,
104104
"gridcolor": "white"
105105
},
@@ -114,7 +114,7 @@
114114
"ticklabelposition": "inside",
115115
"tickfont": { "size": 16 },
116116
"ticklen": 8,
117-
"tickwidth": 2,
117+
"tickwidth": 4,
118118
"linewidth": 4,
119119
"gridcolor": "white"
120120
},

test/image/mocks/ticklabelposition-2.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@
4747
"ticklabelposition": "inside right",
4848
"tickfont": { "size": 20 },
4949
"ticklen": 8,
50-
"tickwidth": 2,
50+
"tickwidth": 4,
5151
"linewidth": 4,
5252
"linecolor": "yellow",
5353
"tickcolor": "yellow",
@@ -63,7 +63,7 @@
6363
"ticklabelposition": "inside bottom",
6464
"tickfont": { "size": 20 },
6565
"ticklen": 8,
66-
"tickwidth": 2,
66+
"tickwidth": 4,
6767
"linewidth": 4,
6868
"linecolor": "yellow",
6969
"tickcolor": "yellow",
@@ -109,7 +109,7 @@
109109
"ticklabelposition": "inside left",
110110
"tickfont": { "size": 16 },
111111
"ticklen": 8,
112-
"tickwidth": 2,
112+
"tickwidth": 4,
113113
"linewidth": 4,
114114
"linecolor": "yellow",
115115
"tickcolor": "yellow",
@@ -127,7 +127,7 @@
127127
"tickangle": -45,
128128
"tickfont": { "size": 16 },
129129
"ticklen": 8,
130-
"tickwidth": 2,
130+
"tickwidth": 4,
131131
"linewidth": 4,
132132
"linecolor": "yellow",
133133
"tickcolor": "yellow",

0 commit comments

Comments
 (0)