Skip to content

Layer fix #2121

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.

Sign up for GitHub

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 5 commits into from
Oct 27, 2017
Merged

Layer fix #2121

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
af9f8f9
move layer: above shapes and images to toppaper
alexcjohnson Oct 25, 2017
0162797
move updatemenus to their own layer above infolayer
alexcjohnson Oct 25, 2017
5039aa5
fix shape editing
alexcjohnson Oct 26, 2017
4e627d9
fix updatemenu test
alexcjohnson Oct 26, 2017
e0a10af
keep dropdown button container on top when new menus are added
alexcjohnson Oct 27, 2017
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
2 changes: 1 addition & 1 deletion src/components/updatemenus/draw.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ module.exports = function draw(gd) {
*/

// draw update menu container
var menus = fullLayout._infolayer
var menus = fullLayout._menulayer
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ha I guess that does it. I first thought about splitting the updatemenu buttons from their header <g> i.e. the header would have remained in <g infolayer> and the buttons moved to <g menulayer>.

Can anyone think of a situation where one would want to place an updatemenu below other <g infolayer> features?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I can't see when you'd want the updatemenu below anything else, but I guess it could be useful to separate <g menulayer> itself into two pieces, so that regardless of the order you draw the menus, when they open up the transient parts will be on top. The only case I can think of that would really need this is if you have two menus that each overlaps the other when opened - one above that opens downward and one below that opens upward for example. If you have a lot of menus that might become necessary at times.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Updatemenus were already smart enough to put the dropdown buttons (but not always-visible buttons) on top - exactly what I was suggesting 🎉 🏆 But there was a bug with this that if a new menu was added when other menus already existed, this would get added on top of the dropdown buttons -> fixed in e0a10af

.selectAll('g.' + constants.containerClassName)
.data(menuData.length > 0 ? [0] : []);

Expand Down
1 change: 1 addition & 0 deletions src/plot_api/plot_api.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2848,6 +2848,7 @@ function makePlotFramework(gd) {
.classed('shapelayer', true);

fullLayout._infolayer = fullLayout._toppaper.append('g').classed('infolayer', true);
fullLayout._menulayer = fullLayout._toppaper.append('g').classed('menulayer', true);
fullLayout._zoomlayer = fullLayout._toppaper.append('g').classed('zoomlayer', true);
fullLayout._hoverlayer = fullLayout._toppaper.append('g').classed('hoverlayer', true);

Expand Down
Binary file modified test/image/baselines/updatemenus.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
20 changes: 17 additions & 3 deletions test/image/mocks/updatemenus.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -79,6 +79,16 @@
},
"visible": false,
"name": "Data set 3"
},
{
"x": [2, 3, 4],
"y": [0.4, 0.6, 0.8],
"z": [[1, 2], [3, 4]],
"type": "heatmap",
"colorbar": {
"x": -0.2,
"y": 0.6
}
}
],
"layout": {
Expand Down Expand Up @@ -123,7 +133,8 @@
true,
false,
false,
false
false,
true
]
],
"label": "Data set 0"
Expand All @@ -136,7 +147,8 @@
false,
true,
false,
false
false,
true
]
],
"label": "Data set 1"
Expand All @@ -149,7 +161,8 @@
false,
false,
true,
false
false,
true
]
],
"label": "Data set 2"
Expand All @@ -162,6 +175,7 @@
false,
false,
false,
true,
true
]
],
Expand Down