Skip to content

Array support for trace hoverinfo #1761

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 10 commits into from
Jun 6, 2017
8 changes: 7 additions & 1 deletion src/components/fx/calc.js
Original file line number Diff line number Diff line change
Expand Up @@ -25,11 +25,17 @@ module.exports = function calc(gd) {
var cd = calcdata[i];
var trace = cd[0].trace;

if(!trace.hoverlabel) continue;
// don't include hover calc fields for pie traces
// as calcdata items might be sorted by value and
// won't match the data array order.
if(Registry.traceIs(trace, 'pie')) continue;

var mergeFn = Registry.traceIs(trace, '2dMap') ? paste : Lib.mergeArray;

mergeFn(trace.hoverinfo, cd, 'hi', makeCoerceHoverInfo(trace));

if(!trace.hoverlabel) continue;

mergeFn(trace.hoverlabel.bgcolor, cd, 'hbg');
mergeFn(trace.hoverlabel.bordercolor, cd, 'hbc');
mergeFn(trace.hoverlabel.font.size, cd, 'hts');
Expand Down
12 changes: 5 additions & 7 deletions src/traces/pie/plot.js
Original file line number Diff line number Diff line change
Expand Up @@ -124,20 +124,18 @@ module.exports = function plot(gd, cdpie) {
if(hoverinfo.indexOf('value') !== -1) thisText.push(helpers.formatPieValue(pt.v, separators));
if(hoverinfo.indexOf('percent') !== -1) thisText.push(helpers.formatPiePercent(pt.v / cd0.vTotal, separators));

var hoverLabelOpts = trace2.hoverlabel;

Fx.loneHover({
x0: hoverCenterX - rInscribed * cd0.r,
x1: hoverCenterX + rInscribed * cd0.r,
y: hoverCenterY,
text: thisText.join('<br>'),
name: hoverinfo.indexOf('name') !== -1 ? trace2.name : undefined,
idealAlign: pt.pxmid[0] < 0 ? 'left' : 'right',
color: pt.hbg || hoverLabelOpts.bgcolor || pt.color,
borderColor: pt.hbc || hoverLabelOpts.bordercolor,
fontFamily: pt.htf || hoverLabelOpts.font.family,
fontSize: pt.hts || hoverLabelOpts.font.size,
fontColor: pt.htc || hoverLabelOpts.font.color
color: Fx.castHoverOption(trace, pt.i, 'bgcolor') || pt.color,
Copy link
Contributor Author

Choose a reason for hiding this comment

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

I never realized that pie/calc.js sorts calcdata items meaning the fullData array order isn't preserved. That is, we can't fill in pie calcdata items with hoverlabel field in order. Luckily here, we can simply reuse the gl2d/gl3d machinery.

This commit fixes pie traces with array hoverlabel values.

Copy link
Collaborator

Choose a reason for hiding this comment

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

This commit fixes pie traces with array hoverlabel values.

Good catch! Is this covered in the tests? If it is, it's not obvious to me which one...

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Is this covered in the tests?

yes

image

Copy link
Contributor Author

Choose a reason for hiding this comment

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

... which was previously broken.

Copy link
Collaborator

Choose a reason for hiding this comment

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

Great - I saw that change, just couldn't tell why it tested this behavior - but a failure is a failure, works for me!

borderColor: Fx.castHoverOption(trace, pt.i, 'bordercolor'),
fontFamily: Fx.castHoverOption(trace, pt.i, 'font.family'),
fontSize: Fx.castHoverOption(trace, pt.i, 'font.size'),
fontColor: Fx.castHoverOption(trace, pt.i, 'font.color')
}, {
container: fullLayout2._hoverlayer.node(),
outerContainer: fullLayout2._paper.node()
Expand Down
4 changes: 2 additions & 2 deletions test/jasmine/tests/hover_pie_test.js
Original file line number Diff line number Diff line change
Expand Up @@ -242,9 +242,9 @@ describe('pie hovering', function() {
assertLabel(['4', 'SUP', '5', '33.3%']);

return Plotly.restyle(gd, {
'hoverlabel.bgcolor': [['red', 'green', 'blue']],
'hoverlabel.bgcolor': [['red', 'green', 'blue', 'yellow', 'red']],
'hoverlabel.bordercolor': 'yellow',
'hoverlabel.font.size': [[15, 20, 30]],
'hoverlabel.font.size': [[15, 20, 30, 20, 15]],
'hoverlabel.font.family': 'Roboto',
'hoverlabel.font.color': 'blue'
});
Expand Down