Skip to content

Commit 259c942

Browse files
archmojarchmoj
authored
Merge pull request #6307 from plotly/minfinal-width-height
Expose `minreducedwidth` and `minreducedheight` to API
2 parents 55f86ea + 0fff290 commit 259c942

9 files changed

+194
-8
lines changed

‎draftlogs/6307_add.md

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
Add `minreducedwidth` and `minreducedheight` as layout parameters [[#6307](https://github.com/plotly/plotly.js/pull/6307)]

‎src/plots/layout_attributes.js

+14
Original file line numberDiff line numberDiff line change
@@ -189,6 +189,20 @@ module.exports = {
189189
'Sets the plot\'s height (in px).'
190190
].join(' ')
191191
},
192+
minreducedwidth: {
193+
valType: 'number',
194+
min: 2,
195+
dflt: 64,
196+
editType: 'plot',
197+
description: 'Minimum width of the plot with margin.automargin applied (in px)'
198+
},
199+
minreducedheight: {
200+
valType: 'number',
201+
min: 2,
202+
dflt: 64,
203+
editType: 'plot',
204+
description: 'Minimum height of the plot with margin.automargin applied (in px)'
205+
},
192206
margin: {
193207
l: {
194208
valType: 'number',

‎src/plots/plots.js

+11-8
Original file line numberDiff line numberDiff line change
@@ -1506,6 +1506,9 @@ plots.supplyLayoutGlobalDefaults = function(layoutIn, layoutOut, formatObj) {
15061506

15071507
coerce('width');
15081508
coerce('height');
1509+
coerce('minreducedwidth');
1510+
coerce('minreducedheight');
1511+
15091512
coerce('margin.l');
15101513
coerce('margin.r');
15111514
coerce('margin.t');
@@ -1861,10 +1864,6 @@ function initMargins(fullLayout) {
18611864
var MIN_SPECIFIED_WIDTH = 2;
18621865
var MIN_SPECIFIED_HEIGHT = 2;
18631866

1864-
// could be exposed as an option - the smallest we will allow automargin to shrink a larger plot
1865-
var MIN_REDUCED_WIDTH = 64;
1866-
var MIN_REDUCED_HEIGHT = 64;
1867-
18681867
/**
18691868
* autoMargin: called by components that may need to expand the margins to
18701869
* be rendered on-plot.
@@ -1885,17 +1884,19 @@ plots.autoMargin = function(gd, id, o) {
18851884
var width = fullLayout.width;
18861885
var height = fullLayout.height;
18871886
var margin = fullLayout.margin;
1887+
var minreducedwidth = fullLayout.minreducedwidth;
1888+
var minreducedheight = fullLayout.minreducedheight;
18881889

18891890
var minFinalWidth = Lib.constrain(
18901891
width - margin.l - margin.r,
18911892
MIN_SPECIFIED_WIDTH,
1892-
MIN_REDUCED_WIDTH
1893+
minreducedwidth
18931894
);
18941895

18951896
var minFinalHeight = Lib.constrain(
18961897
height - margin.t - margin.b,
18971898
MIN_SPECIFIED_HEIGHT,
1898-
MIN_REDUCED_HEIGHT
1899+
minreducedheight
18991900
);
19001901

19011902
var maxSpaceW = Math.max(0, width - minFinalWidth);
@@ -1974,6 +1975,8 @@ plots.doAutoMargin = function(gd) {
19741975
var mb = margin.b;
19751976
var pushMargin = fullLayout._pushmargin;
19761977
var pushMarginIds = fullLayout._pushmarginIds;
1978+
var minreducedwidth = fullLayout.minreducedwidth;
1979+
var minreducedheight = fullLayout.minreducedheight;
19771980

19781981
if(fullLayout.margin.autoexpand !== false) {
19791982
for(var k in pushMargin) {
@@ -2032,13 +2035,13 @@ plots.doAutoMargin = function(gd) {
20322035
var minFinalWidth = Lib.constrain(
20332036
width - margin.l - margin.r,
20342037
MIN_SPECIFIED_WIDTH,
2035-
MIN_REDUCED_WIDTH
2038+
minreducedwidth
20362039
);
20372040

20382041
var minFinalHeight = Lib.constrain(
20392042
height - margin.t - margin.b,
20402043
MIN_SPECIFIED_HEIGHT,
2041-
MIN_REDUCED_HEIGHT
2044+
minreducedheight
20422045
);
20432046

20442047
var maxSpaceW = Math.max(0, width - minFinalWidth);

‎test/image/baselines/z-automargin-minreducedheight.png

16.4 KB
Loading

‎test/image/baselines/z-automargin-minreducedwidth.png

13.4 KB
Loading

‎test/image/mocks/z-automargin-minreducedheight.json

+55
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
{
2+
"data": [{
3+
"name": "< D E A T H >",
4+
"marker": { "color": "red" },
5+
"x": [
6+
"Antonio Vivaldi",
7+
"Johann Sebastian Bach",
8+
"Wolfgang Amadeus Mozart",
9+
"Ludwig van Beethoven"
10+
],
11+
"y": [
12+
"1741",
13+
"1750",
14+
"1791",
15+
"1827"
16+
]
17+
},
18+
{
19+
"name": "< B I R T H >",
20+
"marker": { "color": "blue" },
21+
"x": [
22+
"Antonio Vivaldi",
23+
"Johann Sebastian Bach",
24+
"Wolfgang Amadeus Mozart",
25+
"Ludwig van Beethoven"
26+
],
27+
"y": [
28+
"1678",
29+
"1685",
30+
"1756",
31+
"1770"
32+
]
33+
}],
34+
"layout": {
35+
"title": {
36+
"text": "Longest and shortest<br>names and time periods"
37+
},
38+
"width": 240,
39+
"height": 300,
40+
"minreducedheight": 55,
41+
"margin": {
42+
"t": 80,
43+
"b": 20,
44+
"l": 20,
45+
"r": 20
46+
},
47+
"yaxis": {
48+
"type": "date",
49+
"automargin": true
50+
},
51+
"xaxis": {
52+
"automargin": true
53+
}
54+
}
55+
}

‎test/image/mocks/z-automargin-minreducedwidth.json

+56
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
{
2+
"data": [{
3+
"name": "< D E A T H >",
4+
"marker": { "color": "red" },
5+
"y": [
6+
"A n t o n i o V i v a l d i",
7+
"J o h a n n S e b a s t i a n B a c h",
8+
"W o l f g a n g A m a d e u s M o z a r t",
9+
"L u d w i g v a n B e e t h o v e n"
10+
],
11+
"x": [
12+
"1741",
13+
"1750",
14+
"1791",
15+
"1827"
16+
]
17+
},
18+
{
19+
"name": "< B I R T H >",
20+
"marker": { "color": "blue" },
21+
"y": [
22+
"A n t o n i o V i v a l d i",
23+
"J o h a n n S e b a s t i a n B a c h",
24+
"W o l f g a n g A m a d e u s M o z a r t",
25+
"L u d w i g v a n B e e t h o v e n"
26+
],
27+
"x": [
28+
"1678",
29+
"1685",
30+
"1756",
31+
"1770"
32+
]
33+
}],
34+
"layout": {
35+
"showlegend": false,
36+
"title": {
37+
"text": "Longest and shortest<br>names and time periods"
38+
},
39+
"width": 240,
40+
"height": 200,
41+
"minreducedwidth": 55,
42+
"margin": {
43+
"t": 80,
44+
"b": 20,
45+
"l": 20,
46+
"r": 20
47+
},
48+
"xaxis": {
49+
"type": "date",
50+
"automargin": true
51+
},
52+
"yaxis": {
53+
"automargin": true
54+
}
55+
}
56+
}

‎test/jasmine/tests/plots_test.js

+43
Original file line numberDiff line numberDiff line change
@@ -1326,3 +1326,46 @@ describe('grids', function() {
13261326
.then(done, done.fail);
13271327
});
13281328
});
1329+
1330+
describe('Test Plots with automargin and minreducedwidth/height', function() {
1331+
var gd;
1332+
1333+
beforeEach(function() {
1334+
gd = createGraphDiv();
1335+
});
1336+
1337+
afterEach(destroyGraphDiv);
1338+
1339+
it('should resize the plot area when tweaking min-reduced width & height', function(done) {
1340+
function assert(attr, exp) {
1341+
var xy = d3Select('rect.nsewdrag')[0][0];
1342+
expect(xy.getAttribute(attr)).toEqual(exp);
1343+
}
1344+
1345+
function assertClose(attr, exp) {
1346+
var xy = d3Select('rect.nsewdrag')[0][0];
1347+
expect(xy.getAttribute(attr)).toBeCloseTo(exp, -1);
1348+
}
1349+
1350+
var fig = require('@mocks/z-automargin-minreducedheight.json');
1351+
1352+
Plotly.newPlot(gd, fig)
1353+
.then(function() {
1354+
assertClose('height', '55');
1355+
})
1356+
.then(function() {
1357+
return Plotly.relayout(gd, 'minreducedheight', 100);
1358+
})
1359+
.then(function() {
1360+
assert('height', '100');
1361+
})
1362+
.then(function() {
1363+
return Plotly.relayout(gd, 'minreducedwidth', 100);
1364+
})
1365+
.then(function() {
1366+
assert('width', '100');
1367+
assert('height', '100');
1368+
})
1369+
.then(done, done.fail);
1370+
});
1371+
});

‎test/plot-schema.json

+14
Original file line numberDiff line numberDiff line change
@@ -3386,6 +3386,20 @@
33863386
"editType": "none",
33873387
"valType": "string"
33883388
},
3389+
"minreducedheight": {
3390+
"description": "Minimum height of the plot with margin.automargin applied (in px)",
3391+
"dflt": 64,
3392+
"editType": "plot",
3393+
"min": 2,
3394+
"valType": "number"
3395+
},
3396+
"minreducedwidth": {
3397+
"description": "Minimum width of the plot with margin.automargin applied (in px)",
3398+
"dflt": 64,
3399+
"editType": "plot",
3400+
"min": 2,
3401+
"valType": "number"
3402+
},
33893403
"modebar": {
33903404
"activecolor": {
33913405
"description": "Sets the color of the active or hovered on icons in the modebar.",

0 commit comments

Comments
 (0)