question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Align legend labels to right/end

See original GitHub issue

Hey, I’m working with doughnut charts, with a legend in the right section of the canvas (position: ‘right’). I’m trying to achieve something like this: Captura de pantalla 2021-03-18 a las 9 01 56

I’m trying to align the legend labels (the text with the % value, not the box) to the right, but i can’t make it. I tried position: 'right', align: 'right', in the legend configuration, but the text does not align to the ‘right’.

Is this a bug or am i doing something wrong?

Captura de pantalla 2021-03-18 a las 9 02 56

Chart.js version ^3.0.0-beta.14

Thanks

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:6 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
kurklecommented, Mar 18, 2021

The legend align property is typed as TextAlign = 'left' | 'center' | 'right' , not 'start' | 'center' | 'end'. It’s confusing, since the name “TextAlign” indicates that i can achieve the result i want, but it does not work as expected.

ok, that one is a bug in types.

0reactions
Sergiobopcommented, Mar 18, 2021

Thanks for the fast response and PR 🚀 You guys are amazing!

Read more comments on GitHub >

github_iconTop Results From Across the Web

Aligning the keys legend and labels to the right side of the ...
I know the legend.text.align argument of the theme() function but it controls only the distance between a keys and its the corresponding label....
Read more >
FAQ-829 How can I right-align legend text or ... - OriginLab
To right-align legend text, select the legend object, then: Click the Alignment button Button Align Left.png on the Format toolbar and choose ...
Read more >
How To: Change the alignment of a legend title in an ArcGIS ...
Change the alignment of the legend title by expanding the Position section in the Format Legend. The title is now aligned to the...
Read more >
HTML | <legend> align Attribute - GeeksforGeeks
The <legend> align attribute in HTML is used to specify the alignment of the caption in a <fieldset> element. The left and right...
Read more >
Aligning parts of the legend text on the right side · Issue #361
You can align the value label by setting the following to the legend: chart.legend = new am4charts.Legend(); chart.legend.position = "right"; ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found