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

Radar point overlap their label #8603

Closed
mrleblanc101 opened this issue Mar 9, 2021 · 1 comment · Fixed by #8604
Closed

Radar point overlap their label #8603

mrleblanc101 opened this issue Mar 9, 2021 · 1 comment · Fixed by #8604

Comments

@mrleblanc101
Copy link

Capture d’écran, le 2021-03-09 à 12 58 26

Expected Behavior

The point should not overlap the label.

Current Behavior

The chart positioning doesn't take the point size into account.

Possible Solution

Adding a padding or offset options to pointsLabels.
A potential fix was proposed in #5873 but it ended up being reject as another PR was supposed to solve this problem by adding a line-height setting.
Increasing the line-height is not a solution when using multiline labels.

Steps to Reproduce

Charts.js: https://codepen.io/kurkle/pen/qBqQqxa
Vue-chart.js: https://codesandbox.io/s/autumn-frog-bel26?file=/components/RadarChart.vue

Environment

  • Chart.js version: 2.9.4
  • Browser name and version: Chrome 89
@mrleblanc101
Copy link
Author

Exemple with increased lineHeight and why it's not a good solution when using mutiline labels.
Capture d’écran, le 2021-03-09 à 14 14 03

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

Successfully merging a pull request may close this issue.

1 participant