Skip to content
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

Hide hover and spike modebar buttons in plotly.js v2 by default and add config options to bring them back in #5654

Merged
merged 8 commits into from
May 14, 2021
Merged

Hide hover and spike modebar buttons in plotly.js v2 by default and add config options to bring them back in #5654

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
b19d960
drop hover and spike modebars
archmoj May 10, 2021
992352b
add hover and spike modes to extra modes that could be enabled
archmoj May 10, 2021
f7d5a3a
adjust tests
archmoj May 10, 2021
74649d0
enable hover modebars using simplified strings
archmoj May 12, 2021
3602a51
use lowercase for exposed hover button names
archmoj May 12, 2021
cd6c5a1
bring back and adjust two noHover tests
archmoj May 12, 2021
2d4bc78
accept uppercase and camelCase strings modebar button strings
archmoj May 13, 2021
f4e6120
add v1hovermode option
archmoj May 13, 2021
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
35 changes: 33 additions & 2 deletions src/components/modebar/manage.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -170,19 +170,50 @@ function getButtonGroups(gd) {
dragModeGroup.push('select2d', 'lasso2d');
}

// accept pre-defined buttons as string
var enabledHoverGroup = [];
var enableHover = function(a) {
// return if already added
if(enabledHoverGroup.indexOf(a) !== -1) return;
// should be in hoverGroup
if(hoverGroup.indexOf(a) !== -1) {
enabledHoverGroup.push(a);
}
};
Copy link
Collaborator

Choose a reason for hiding this comment

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

So what you're saying is, we still calculate the hover entries you would have gotten, back in 1.x when we included them by default, and in 2.x you won't get them by default but you'll be allowed to re-include any of those exact buttons but no others.

I guess it makes sense to restrict to only the buttons we know will work, but as a user it may be hard to figure out what those buttons are in any given case. For example Sankey gets ['hoverClosestCartesian', 'hoverCompareCartesian']? And some multi-type plots just get ['toggleHover'] but others get something more specific?

What if we accept a special buttonsToAdd value 'hovermode', that copies all of hoverGroup into enabledHoverGroup - ie to get back 1.x behavior no matter what traces you have you can just use that one special value?

Copy link
Contributor

Choose a reason for hiding this comment

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

What if we accept a special buttonsToAdd value 'hovermode'

this sounds like a good solution to me.

Copy link
Contributor

Choose a reason for hiding this comment

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

maybe v1hovermode or something to clearly identify this as "the v1 behaviour" ?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

So what you're saying is, we still calculate the hover entries you would have gotten, back in 1.x when we included them by default, and in 2.x you won't get them by default but you'll be allowed to re-include any of those exact buttons but no others.

Exactly.

Copy link
Contributor Author

@archmoj archmoj May 13, 2021 •
edited
Loading

Choose a reason for hiding this comment

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

What if we accept a special buttonsToAdd value 'hovermode', that copies all of hoverGroup into enabledHoverGroup - ie to get back 1.x behavior no matter what traces you have you can just use that one special value?

It is doable but at the same time rather confusing (and perhaps hard to maintain) as the v1 hoverGroup does include spike options too. Plus in that case we may restrict users to only include all of those buttons but not some?

Copy link
Collaborator

Choose a reason for hiding this comment

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

Right, if you want some subset of the v1 behavior you have to figure out the specific options you need and specify them explicitly.

Good point re: spikes. 'togglespikelines' is pretty simple and easy to document; so let's have 'v1hovermode' give you just the hovermode buttons - ie everything in hoverGroup except toggleSpikelines if it's there.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

OK.
How about allhovermodes instead of v1hovermode?
Later on the road we may want to add extra buttons e.g. for unified hover options and having v1 would make it difficult to add those.

Copy link
Collaborator

Choose a reason for hiding this comment

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

If we call it allhovermodes it's wrong until we add unified. And unified is more a decision chart developers will make, whereas compare vs closest has times it's useful to viewers (mainly for charts that the developer didn't explicitly specify the best hovermode) so I don't see much need to add a button for unified.

Copy link
Contributor

Choose a reason for hiding this comment

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

If we call it allhovermodes it's wrong until we add unified

Yes. I would favour v1hovermodes as it's clear that this is simply brining back the old mode without making any additional promises/implying anything else about "all" anything :)

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Added in f4e6120.

if(Array.isArray(buttonsToAdd)) {
var newList = [];
for(var i = 0; i < buttonsToAdd.length; i++) {
var b = buttonsToAdd[i];
if(typeof b === 'string') {
b = b.toLowerCase();

if(DRAW_MODES.indexOf(b) !== -1) {
// accept pre-defined drag modes i.e. shape drawing features as string
if(
fullLayout._has('mapbox') || // draw shapes in paper coordinate (could be improved in future to support data coordinate, when there is no pitch)
fullLayout._has('cartesian') // draw shapes in data coordinate
) {
dragModeGroup.push(b);
}
} else if(b === 'togglespikelines') {
enableHover('toggleSpikelines');
} else if(b === 'togglehover') {
enableHover('toggleHover');
} else if(b === 'hovercompare') {
enableHover('hoverCompareCartesian');
} else if(b === 'hoverclosest') {
enableHover('hoverClosestCartesian');
enableHover('hoverClosestGeo');
enableHover('hoverClosest3d');
enableHover('hoverClosestGl2d');
enableHover('hoverClosestPie');
} else if(b === 'v1hovermode') {
enableHover('toggleHover');
enableHover('hoverClosestCartesian');
enableHover('hoverCompareCartesian');
enableHover('hoverClosestGeo');
enableHover('hoverClosest3d');
enableHover('hoverClosestGl2d');
enableHover('hoverClosestPie');
}
} else newList.push(b);
}
Expand All @@ -191,7 +222,7 @@ function getButtonGroups(gd) {

addGroup(dragModeGroup);
addGroup(zoomGroup.concat(resetGroup));
addGroup(hoverGroup);
addGroup(enabledHoverGroup);

return appendButtonsToGroups(groups, buttonsToAdd);
}
Expand Down
5 changes: 4 additions & 1 deletion test/jasmine/tests/gl3d_plot_interact_test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -455,6 +455,9 @@ describe('Test gl3d modebar handlers - perspective case', function() {
},
aspectratio: { x: 3, y: 2, z: 1 }
}
},
config: {
modeBarButtonsToAdd: ['hoverclosest']
}
};

Expand Down Expand Up @@ -534,7 +537,7 @@ describe('Test gl3d modebar handlers - perspective case', function() {
expect(buttonOrbit.isActive()).toBe(false);
});

it('@gl button hoverClosest3d should update the scene hovermode and spikes', function() {
it('@gl button hoverClosest should update the scene hovermode and spikes', function() {
var buttonHover = selectButton(modeBar, 'hoverClosest3d');

assertScenes(gd._fullLayout, 'hovermode', 'closest');
Expand Down
Loading