Legend values get cropped in Advance pie chart

lokeshdaiya commented 6 years ago

I'm submitting a ... (check one with "x")

[x] bug report => search github for a similar issue or PR before submitting
[ ] feature request
[ ] support request => Please do not submit support request here

Current behavior The numbers displayed in Legend are getting cropped in advance pie chart.

Expected behavior Values should be displayed correctly

Reproduction of the problem Have a look on below plnkr https://plnkr.co/edit/oY7YqAEMG5Yf0CoI8H4v?p=preview

capture

What is the motivation / use case for changing the behavior? Better user interface

Please tell us about your environment: Windows 7

ngx-charts version: x.x.x 7.0.1
Angular version: 2.x.x 5.x.x
Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ] checked on Chrome Version 63.0.3239.132
Language: [all | TypeScript X.X | ES6/7 | ES5]

cedvdb commented 6 years ago

a scroller also displays when the view is too small https://plnkr.co/edit/Wi5t8oMzbkhbGNP54OBW?p=preview

marjan-georgiev commented 6 years ago

The scroller is there by design. The values are cropped because of the font size. If you update the font size through css it should work fine:

https://plnkr.co/edit/MJwYT6FIs7catGCfJkMD?p=preview

icepeng commented 6 years ago

Cropped values are not caused by font size, it is about line-height. You can fix issue by setting line-height: 32px to advanced-pie-legend.

vikashchaudhary16 commented 2 years ago

i am also facing same issue because of angular material class mat-typography. kindly help.

swimlane / ngx-charts

Legend values get cropped in Advance pie chart #717