8000 Multiple legend positioning and sizing fixes by etpinard · Pull Request #4160 · plotly/plotly.js · GitHub
[go: up one dir, main page]

Skip to content
8000

Multiple legend positioning and sizing fixes #4160

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 20 commits into from
Sep 23, 2019
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
20 commits
Select commit Hold shift + click to select a range
3ab7713
rm useless legend/anchor_utils.js file
etpinard Aug 15, 2019
de369f3
improve legend x, y, xanchor, yanchor attr declarations
etpinard Aug 14, 2019
1cf347a
drop firstRender logic in Legend.draw
etpinard Aug 7, 2019
82b9769
calc max name/label length in getLegendData
etpinard Aug 7, 2019
0c497bb
add a few things to legend/constants.js
etpinard Aug 9, 2019
f12c62c
drop expandHorizontalMargin logic
etpinard Aug 9, 2019
d770138
some more linting
etpinard Aug 13, 2019
51df66d
trim toggle-rect to more-precise width
etpinard Aug 13, 2019
bf586d4
add more legend mocks (with 1.49.4 baselines)
etpinard Aug 13, 2019
488cca1
fix many legend auto-margin push and positioning edge cases
etpinard Aug 16, 2019
c33c92f
do not constrain legend (x,y) when `margin.autoexpand:false`
etpinard Aug 16, 2019
1e6862a
Lib.log when margin push are dropped
etpinard Aug 14, 2019
1f00a40
add Lib.log when legend (x,y) are constrained into graph width/height
etpinard Aug 30, 2019
2b2bd9b
add mocks showing #4132 bug
etpinard Aug 19, 2019
6b0befe
fix #4132 - fix horizontal legend dimension computations
etpinard Aug 19, 2019
6b2b63b
Merge branch 'master' into legend-horizontal-computed-dims-fix
et 8000 pinard Sep 9, 2019
e92ca98
cleanup legend relayout tests
etpinard Sep 10, 2019
35b0c92
fixup variable name in legend maxWidth logic block
etpinard Sep 10, 2019
42d5e4e
end Legend.draw early when margin-redraw in-progress
etpinard Sep 10, 2019
d043151
add margin.autoexpand attr description
etpinard Sep 23, 2019
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
end Legend.draw early when margin-redraw in-progress
... to avoid race conditions leading to wrong legend
    position and size.
  • Loading branch information
etpinard committed Sep 10, 2019
commit 42d5e4e0e5f9012a141cf91bcdf683436842d890
9 changes: 6 additions & 3 deletions src/components/legend/draw.js
Original file line number Diff line number Diff line change
Expand Up @@ -93,8 +93,12 @@ module.exports = function draw(gd) {
Lib.syncOrAsync([
Plots.previousPromises,
function() { return computeLegendDimensions(gd, groups, traces); },
function() { return expandMargin(gd); },
function() {
// IF expandMargin return a Promise (which is truthy),
// we're under a doAutoMargin redraw, so we don't have to
// draw the remaining pieces below
if(expandMargin(gd)) return;

var gs = fullLayout._size;
var bw = opts.borderwidth;

Expand Down Expand Up @@ -632,8 +636,7 @@ function expandMargin(gd) {
var xanchor = getXanchor(opts);
var yanchor = getYanchor(opts);


Plots.autoMargin(gd, 'legend', {
return Plots.autoMargin(gd, 'legend', {
x: opts.x,
y: opts.y,
l: opts._width * (FROM_TL[xanchor]),
Expand Down
2 changes: 1 addition & 1 deletion src/plots/plots.js
Original file line number Diff line number Diff line change
Expand Up @@ -1863,7 +1863,7 @@ plots.autoMargin = function(gd, id, o) {
}

if(!fullLayout._replotting) {
plots.doAutoMargin(gd);
return plots.doAutoMargin(gd);
}
}
};
Expand Down
28 changes: 28 additions & 0 deletions test/jasmine/tests/legend_test.js
Original file line number Diff line number Diff line change
Expand Up @@ -715,6 +715,34 @@ describe('legend relayout update', function() {
.then(done);
});
});

it('should make legend fit in graph viewport', function(done) {
var fig = Lib.extendDeep({}, require('@mocks/legend_negative_x.json'));

function _assert(msg, xy, wh) {
return function() {
var fullLayout = gd._fullLayout;
var legend3 = d3.select('g.legend');
var bg3 = legend3.select('rect.bg');
var translate = Drawing.getTranslate(legend3);
var x = translate.x;
var y = translate.y;
var w = +bg3.attr('width');
var h = +bg3.attr('height');
expect([x, y]).toBeWithinArray(xy, 25, msg + '| legend x,y');
expect([w, h]).toBeWithinArray(wh, 25, msg + '| legend w,h');
expect(x + w <= fullLayout.width).toBe(true, msg + '| fits in x');
expect(y + h <= fullLayout.height).toBe(true, msg + '| fits in y');
};
}

Plotly.plot(gd, fig)
.then(_assert('base', [5, 4.4], [512, 29]))
.then(function() { return Plotly.relayout(gd, 'legend.x', 0.8); })
.then(_assert('after relayout almost to right edge', [188, 4.4], [512, 29]))
.catch(failTest)
.then(done);
});
});

describe('legend orientation change:', function() {
Expand Down
0