Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 3d097c2

Browse files
etpinardetpinard
committed
initial support for multicategory on y-axes
- improve secondary-label to axis title padding - add horizontal violin mock
1 parent 016846a commit 3d097c2

File tree

5 files changed

+111
-7
lines changed

5 files changed

+111
-7
lines changed

‎src/plots/cartesian/axes.js

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1746,9 +1746,10 @@ axes.drawOne = function(gd, ax, opts) {
17461746

17471747
if(ax.type === 'multicategory') {
17481748
var labelLength = 0;
1749+
var pad = {x: 2, y: 10}[axLetter];
17491750

17501751
seq.push(function() {
1751-
labelLength += getLabelLevelSpan(ax._selections[axId + 'tick']) + 2;
1752+
labelLength += getLabelLevelSpan(ax, axId + 'tick') + pad;
17521753
labelLength += ax._lastangle ? ax.tickfont.size * LINE_SPACING : 0;
17531754
var secondaryPosition = mainLinePosition + labelLength * tickSigns[2];
17541755
var secondaryLabelFns = axes.makeLabelFns(ax, secondaryPosition);
@@ -1765,7 +1766,7 @@ axes.drawOne = function(gd, ax, opts) {
17651766
});
17661767

17671768
seq.push(function() {
1768-
labelLength += getLabelLevelSpan(ax._selections[axId + 'tick2']) + 2;
1769+
labelLength += getLabelLevelSpan(ax, axId + 'tick2');
17691770

17701771
return drawDividers(gd, ax, {
17711772
vals: getDividerVals(ax, vals),
@@ -1972,16 +1973,17 @@ function getDividerVals(ax, vals) {
19721973
return out;
19731974
}
19741975

1975-
function getLabelLevelSpan(tickLabels) {
1976-
var out = 2;
1976+
function getLabelLevelSpan(ax, cls) {
1977+
var out = 0;
1978+
var k = {x: 'height', y: 'width'}[ax._id.charAt(0)];
19771979

1978-
tickLabels.each(function() {
1980+
ax._selections[cls].each(function() {
19791981
var thisLabel = selectTickLabel(this);
19801982

19811983
// TODO Drawing.bBox doesn't work when labels are rotated
19821984
// var bb = Drawing.bBox(thisLabel.node());
19831985
var bb = thisLabel.node().getBoundingClientRect();
1984-
out = Math.max(out, bb.height);
1986+
out = Math.max(out, bb[k]);
19851987
});
19861988

19871989
return out;
@@ -2535,7 +2537,7 @@ function drawTitle(gd, ax) {
25352537

25362538
var titleStandoff;
25372539
if(ax.type === 'multicategory') {
2538-
titleStandoff = ax._boundingBox.height;
2540+
titleStandoff = ax._boundingBox[{x: 'height', y: 'width'}[axLetter]];
25392541
} else {
25402542
var offsetBase = 1.5;
25412543
titleStandoff = 10 + fontSize * offsetBase + (ax.linewidth ? ax.linewidth - 1 : 0);

‎test/image/baselines/box_grouped-multicategory.png

-27 Bytes
Loading

‎test/image/baselines/multicategory.png

-20 Bytes
Loading

‎test/image/baselines/violin_grouped_horz-multicategory.png

36 KB
Loading

‎test/image/mocks/violin_grouped_horz-multicategory.json

Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
{
2+
"data":[
3+
{
4+
"x":[
5+
0.2, 0.2, 0.6, 1, 0.5, 0.4, 0.2, 0.7, 0.9, 0.1, 0.5, 0.3,
6+
0.6, 0.7, 0.3, 0.6, 0, 0.5, 0.7, 0.9, 0.5, 0.8, 0.7, 0.2,
7+
0.2, 0.2, 0.6, 1, 0.5, 0.4, 0.2, 0.7, 0.9, 0.1, 0.5, 0.3
8+
],
9+
"y":[
10+
["2016", "2016", "2016", "2016", "2016", "2016",
11+
"2016", "2016", "2016", "2016", "2016", "2016",
12+
"2017", "2017", "2017", "2017", "2017", "2017",
13+
"2017", "2017", "2017", "2017", "2017", "2017",
14+
"2018", "2018", "2018", "2018", "2018", "2018",
15+
"2018", "2018", "2018", "2018", "2018", "2018"],
16+
17+
["day 1", "day 1", "day 1", "day 1", "day 1", "day 1",
18+
"day 2", "day 2", "day 2", "day 2", "day 2", "day 2",
19+
"day 1", "day 1", "day 1", "day 1", "day 1", "day 1",
20+
"day 2", "day 2", "day 2", "day 2", "day 2", "day 2",
21+
"day 1", "day 1", "day 1", "day 1", "day 1", "day 1",
22+
"day 2", "day 2", "day 2", "day 2", "day 2", "day 2"]
23+
],
24+
"name":"kale",
25+
"marker":{
26+
"color":"#3D9970"
27+
},
28+
"orientation": "h",
29+
"type":"violin"
30+
},
31+
{
32+
"x":[
33+
0.6, 0.7, 0.3, 0.6, 0, 0.5, 0.7, 0.9, 0.5, 0.8, 0.7, 0.2,
34+
0.1, 0.3, 0.1, 0.9, 0.6, 0.6, 0.9, 1, 0.3, 0.6, 0.8, 0.5,
35+
0.6, 0.7, 0.3, 0.6, 0, 0.5, 0.7, 0.9, 0.5, 0.8, 0.7, 0.2
36+
],
37+
"y":[
38+
["2016", "2016", "2016", "2016", "2016", "2016",
39+
"2016", "2016", "2016", "2016", "2016", "2016",
40+
"2017", "2017", "2017", "2017", "2017", "2017",
41+
"2017", "2017", "2017", "2017", "2017", "2017",
42+
"2018", "2018", "2018", "2018", "2018", "2018",
43+
"2018", "2018", "2018", "2018", "2018", "2018"],
44+
45+
["day 1", "day 1", "day 1", "day 1", "day 1", "day 1",
46+
"day 2", "day 2", "day 2", "day 2", "day 2", "day 2",
47+
"day 1", "day 1", "day 1", "day 1", "day 1", "day 1",
48+
"day 2", "day 2", "day 2", "day 2", "day 2", "day 2",
49+
"day 1", "day 1", "day 1", "day 1", "day 1", "day 1",
50+
"day 2", "day 2", "day 2", "day 2", "day 2", "day 2"]
51+
],
52+
"name":"radishes",
53+
"marker":{
54+
"color":"#FF4136"
55+
},
56+
"orientation": "h",
57+
"type":"violin"
58+
},
59+
{
60+
"x":[
61+
0.1, 0.3, 0.1, 0.9, 0.6, 0.6, 0.9, 1, 0.3, 0.6, 0.8, 0.5,
62+
0.1, 0.3, 0.1, 0.9, 0.6, 0.6, 0.9, 1, 0.3, 0.6, 0.8, 0.5,
63+
0.2, 0.2, 0.6, 1, 0.5, 0.4, 0.2, 0.7, 0.9, 0.1, 0.5, 0.3
64+
],
65+
"y":[
66+
["2016", "2016", "2016", "2016", "2016", "2016",
67+
"2016", "2016", "2016", "2016", "2016", "2016",
68+
"2017", "2017", "2017", "2017", "2017", "2017",
69+
"2017", "2017", "2017", "2017", "2017", "2017",
70+
"2018", "2018", "2018", "2018", "2018", "2018",
71+
"2018", "2018", "2018", "2018", "2018", "2018"],
72+
73+
["day 1", "day 1", "day 1", "day 1", "day 1", "day 1",
74+
"day 2", "day 2", "day 2", "day 2", "day 2", "day 2",
75+
"day 1", "day 1", "day 1", "day 1", "day 1", "day 1",
76+
"day 2", "day 2", "day 2", "day 2", "day 2", "day 2",
77+
"day 1", "day 1", "day 1", "day 1", "day 1", "day 1",
78+
"day 2", "day 2", "day 2", "day 2", "day 2", "day 2"]
79+
],
80+
"name":"carrots",
81+
"marker":{
82+
"color":"#FF851B"
83+
},
84+
"orientation": "h",
85+
"type":"violin"
86+
}
87+
],
88+
"layout":{
89+
"yaxis":{
90+
"zeroline":false,
91+
"title":"normalized moisture"
92+
},
93+
"violinmode":"group",
94+
"legend": {
95+
"x": 0,
96+
"xanchor": "right",
97+
"y": 1,
98+
"yanchor": "bottom"
99+
},
100+
"margin": {"l": 100}
101+
}
102+
}

0 commit comments

Comments
 (0)