-
-
Notifications
You must be signed in to change notification settings - Fork 1.9k
Implement percentage flags to control funnel hoverinfo and hovertemplete #3958
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
Conversation
I'm not sure how I feel about camel-casing in |
out.y = 'yVal' in pt ? pt.yVal : pt.y; | ||
|
||
// for funnel | ||
if('percentInitial' in pt) out.percentInitial = pt.percentInitial; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
here out.percentInitial
should be the raw number (i.e. unformatted).
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
is percentInitial
between 0-100 or between 0-1?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Right now with formatting it is between 0-100. The raw ratios are between 0-1.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
FYI - in case of pie
the pt.percent
contains the fraction
not the percent.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is what pie does:
plotly.js/src/traces/pie/plot.js
Lines 365 to 367 in 3e3b22d
pt.percent = pt.v / cd0.vTotal; | |
pt.percentLabel = helpers.formatPiePercent(pt.percent, separators); | |
if(hoverinfo && hoverinfo.indexOf('percent') !== -1) text.push(pt.percentLabel); |
that is:
percent
is in fact a fractionpercentLabel
is a percentage and it is howhoverinfo
flag'percent'
shows up in the hover label. It is also howhovertemplate: '%{percent}'
shows up by default.
For example,
Plotly.newPlot(gd, [{
type: 'pie',
labels: ['a', 'b', 'c'],
values: [1, 2, 3]
}])
shows 16.7%, 33.3% and 50% in the hover labels when 'percent'
is part of the hoverinfo
OR when hovertemplate: '%{percent}'
(i.e. it uses percentLabel
behind the scenes).
But if hovertemplate: '%{y:.3f}'
we get 0.167, 0.333 and 0.500 in the hover labels (i.e. we format the fraction behind the scenes).
@etpinard thanks for your help, |
💃 |
fix #3954
Control percentages via
hoverinfo
andhovertemplate
.Note: the
hovertemplate
keys are incamelCase
format.codepen
@plotly/plotly_js
cc: @nicolaskruchten