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

Limit the width of the legend texts #2770

Closed
justanotheranonymoususer opened this issue Jun 14, 2016 · 4 comments · Fixed by #7852
Closed

Limit the width of the legend texts #2770

justanotheranonymoususer opened this issue Jun 14, 2016 · 4 comments · Fixed by #7852

Comments

@justanotheranonymoususer

Here's an example:
https://fiddle.jshell.net/7mrwjafn/show/light/

As you can see, one of the labels is very long, which makes the chart unusable.
I'd like to have a way to set the maximum size of the legend, probably in pixels.
I could truncate the texts in Javascript, but the effect will be length-wise truncation, unlike pixel-wise truncation.
Perhaps a nice effect, such as fading ellipsis, could be added.

@zapnap
Copy link

zapnap commented Aug 16, 2016

Same issue. Another option would be setting a max width and allowing tooltips to wrap.

@okwme
Copy link

okwme commented Sep 16, 2016

@zapnap are you suggesting to set a max width on the legend's color box and remove the text but add a tooltip to the legend with the text?

@reimersmarkus
Copy link

i have the same issue...
A solution like this would be perfect:
https://www.amcharts.com/kbase/truncating-long-legend-labels-on-pie-chart/

@okwme
Copy link

okwme commented Oct 24, 2016

i ended up using a solution like this:
http://stackoverflow.com/questions/37005297/custom-legend-with-chartjs-v2-0

remove legends from chartjs and then build them as html elements which can be customized however needed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
No open projects
Development

Successfully merging a pull request may close this issue.

6 participants