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.

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

Optionally truncate labels instead of hiding them entirely #109

Open
bnovc opened this issue Apr 12, 2023 · 2 comments
Open

Optionally truncate labels instead of hiding them entirely #109

bnovc opened this issue Apr 12, 2023 · 2 comments

Comments

@bnovc
Copy link

bnovc commented Apr 12, 2023

Is your feature request related to a problem? Please describe.
When you have fairly long labels, you get entirely empty cells

This makes reading the charts very difficult, and it means that sharing static screenshots of them isn't viable

Describe the solution you'd like
If a label doesn't fit, keep removing text from it until it does

Describe alternatives you've considered
Wrapping text could be helpful too, but there are other requests for that here, and I understand the challenge

Additional context
Add any other context or screenshots about the feature request here.

@bnovc
Copy link
Author

bnovc commented Apr 12, 2023

I accomplished this by adding in:

function angularTextMax(d) { var deltaAngle = state.angleScale(d.x1) - state.angleScale(d.x0); var r = Math.max(0, (state.radiusScale(d.y0) + state.radiusScale(d.y1)) / 2); var perimeter = r * deltaAngle; return perimeter / CHAR_PX_WIDTH; }

And using it allSlices.select('.angular-label').transition(transition$1).styleTween('display', function (d) {

@soup-pockets
Copy link

Hi @bnovc, can you provide the missing code in the last block?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants